CSS divs positioning question

Discussion in 'Software' started by georgey12345, Jun 16, 2009.

  1. georgey12345

    georgey12345 Private E-2

    I am designing a site with HTML and CSS. I cant position the divs correctly. Can someone tell me the correct code. Imagine 2 divs, one on the right and one the left, both of same heights. That is simple. But i would like one on the left and 3 on the right, and the height must add up back to that of the left.

    Thank you so much for your help.
     
  2. MutD

    MutD Specialist

    This should do it (only tested in Firefox)

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    
    <html>
      <body>
    
        <div style="float:left; background-color:red; width:50%; height:600px;">a</div>
    
        <div style="float:right;width:50%;">
    
          <div style="background-color:blue; height:200px;">b</div>
          <div style="background-color:yellow; height:200px;">c</div>
          <div style="background-color:green; height:200px;">d</div>
        </div>
    
    </body>
    </html>
    Moving the inline styles into a css file is an exercise left for the reader :)
     

MajorGeeks.Com Menu

Downloads All In One Tweaks \ Android \ Anti-Malware \ Anti-Virus \ Appearance \ Backup \ Browsers \ CD\DVD\Blu-Ray \ Covert Ops \ Drive Utilities \ Drivers \ Graphics \ Internet Tools \ Multimedia \ Networking \ Office Tools \ PC Games \ System Tools \ Mac/Apple/Ipad Downloads

Other News: Top Downloads \ News (Tech) \ Off Base (Other Websites News) \ Way Off Base (Offbeat Stories and Pics)

Social: Facebook \ YouTube \ Twitter \ Tumblr \ Pintrest \ RSS Feeds