Search code examples
imagetwitter-bootstrapfooter

Stuck! I need some help creating this footer

This is my first post here. I was wondering whether you could suggest to me how to make the footer in this image:
http://i5.minus.com/ik0O1e7e2qWQd.jpg


So far I have this:
http://www.seann.biz/testflight
But I can't quite get the footer right. I am using bootstrap by the way. As you can see there are two columns of the same width but of varying colour and I would love to get these two sorted first then the rest to follow later. This is the first full website I have coded so sorry if its a bit messy

Solution

  • you can use css width:50% then float:left, add it at the end

    Something like this:

    <div id="footer" style="width:100%;height:300px">
  <div id="footerleft" style="width:50%;height:300px;background-color:#000;float: left;"></div>
  <div id="footerright" style="width:50%;height:300px;background-color:#ccc;float: left;"></div>
</div>

    hope this helps

    EDIT

    check this fiddle http://jsfiddle.net/X4tdz/

    Add the following css to the image

    • position:absolute
    • left:50%
    • top:50%
    • margin-left:-50px // half of the image width
    • margin-top:-50px // half of the image height

    Make sure the parent div of the image is set to position:relative

    PS: If you have any NEW questions make a new question about it so that others can also contribute.