Results 1 to 2 of 2
  1. #1
    Join Date
    Aug 2005

    Question xhtml + css qustion (div position ...)

    Hello everyone, I'm gradually getting to know a bit about css but I have got a problem that I am trying to understand. The thing is that my page shows up well in IE but not firefox or any other good browsers

    This is what I have done :

    1 div at the top of the page with width = 100% with other div's in it (my header)
    1 div below this div(I'll call it my second div), with a fixed width and left and right margins set to auto so this div is centered on the page, this contains other div's too and is my page's main body
    1 div just after these two div's with width = 100% and is used as my footer.

    None of these 3 div's have any float options. The first div's height is fixed and the bottom one is too but the middle one is not set so it adapts to it's contents.

    The problem is that on firefox the bottom div does not recognise the height of the 2nd div and shows up just below the 1st div ... and therefore is behind the middle div and not under the middle div where I want it to be.

    I have tried playing with the float settings but this removes the auto margin and is no longer centered on the page, I have tried changing the position setting, playing around with static, absolute and relative but these settings change the page layout...
    The nearest solution I have found is to set clear = both and then the bottom div is below the 2nd div but the margins are not taken into account ( I want a 10px margin between the 2nd div and the 3rd div)

    I hope that I have been clear enough and that someone might be able to tell me what else I coud try to get the 3rd div to go below the 2nd div... is there an easy solution, I'm sure that I am missing something ...

  2. #2
    Join Date
    Aug 2005
    Hi it's me again, I have sort of found a solution but I don't believe that this is the best way ...
    I have create a div which I have set clear to clear = both which places this new div below the 2nd div, I then set the padding to 10px to achieve my 10px space and then I create my 3rd div inside this new div and it show's up well on IE and firefox, however I like my code to be as clean as possible so I would be very greatfull if someone knows how to do this, and what I am doing wring ! thanks in advance !

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts