Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Oct 2002
    Posts
    147
    Thanks
    31
    Thanked 2 Times in 2 Posts

    FireFox IE 7 css layout - Why?

    Hi
    below i have attached a screen shot and code of my question....

    Can you please tell me why the yellow block does not behaive the same in FIREFOX as in IE

    But if I insert an image (curently commented out in the code below ) before the closing tag of the yellow block then it behaives .

    Why does the yellow block not see that it has content in side it in FIREFOX.

    Thanks..

    <html>
    <head>
    <style>

    .block{ border: 1px solid #FF0000; width:350px; height:150px; background:#66Adff; float:left; }

    .main{ margin:auto; width:800px; height:auto; background-color: #FFFF00; border: 1px solid #00FF00; padding:20px; }

    .square{ border: 1px solid #000000; width:100px; height:100px; background:blue; }


    </style>
    </head>

    <body>
    <div class="main">

    <div class="block">
    <div class="square"> </div>
    </div>

    <div class="block">
    <div class="square"> </div>
    </div>



    <!-- <img src="image_1.gif" width="100" height="10" border="0px"> -->
    </div>
    </body>
    </html>


  • #2
    Regular Coder
    Join Date
    Jul 2007
    Posts
    571
    Thanks
    25
    Thanked 28 Times in 28 Posts
    Your problem has to do with clearing.

    I had a question to do with the same sort of problem .

    Aerospace_Eng_ derected me to site that explains what is happening and how to fix the problem. you should check it out to:http://www.positioniseverything.net/easyclearing.html


  •  

    Posting Permissions

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