Problem with the DIV-layouting.

Discussion in 'CSS' started by So1, Jul 18, 2008.

  1. #1
    The problem is to make it works in IE, FF & Opera...
    I use elastic DIV-layouting for one of my sites, but im not too much expirienced with it...

    the site is http://fasion25.ru/ (Russian).
    I made one main DIV:
    <div class='content-block'>
    Code (markup):
    in this DIV i want to make two gray DIVs and one DIV with white background:
    
    	<div class='gray-box' style='width:429px; float:left;' name='gbx1' id='gbx1'>
    		
    	</div>
    	<div class='gray-box' style='width:271px; float:left;' name='gbx' id='gbx'>
    
    	</div>
    	<div class='white-box' style='float:right; width:auto' name='whitebx' id='whitebx'>
    
    	</div>
    
    Code (markup):
    </div> <!-- end of main DIV -->
    Code (markup):
    the standard height is 203 for this divs (main div and div with class='gray-box')
    What is problem?
    When i add many text in gbx1, its height increasing, but the height of gbx holding the same (less then gbx1's height). If i set for main DIV gray background, gray-box style position:relative; height:203px; it will works only in IE, but FF and Opera shows layouting incorrect...

    If u need more details, i'll upload files into html dir of fasion.ru (now im in hurry... forced to go outside - in the town).
    If u were into such confront, please, describe the decision...


    Thanks in advance and sorry for my bad english (maybe :D )
     
    So1, Jul 18, 2008 IP
  2. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #2
    You seem to have forgot to upload the file.

    Any time IE looks OK and modern browsers don't, the code is wrong. If you code against a buggy browser like IE, you will write buggy code. In this case, you're not enclosing your float elements.

    cheers,

    gary
     
    kk5st, Jul 18, 2008 IP