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 5 of 5
  1. #1
    Regular Coder
    Join Date
    Aug 2002
    Location
    IN, USA
    Posts
    121
    Thanks
    0
    Thanked 0 Times in 0 Posts

    100% height with Strict DTD

    Im working on another (lol) layout, and I want one of my divs to be 100% height. Is there any way of accomplishing this using a XHTML 1.0 Strict or Transitional DTD
    Just call me Crash...
    "Crash- and BURN!"
    -Cereal Killer

  • #2
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    html, body, .mybox {
    height: 100%;
    }

    Where your div is assigned a class of "mybox"

  • #3
    Regular Coder
    Join Date
    Aug 2002
    Location
    IN, USA
    Posts
    121
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks, never wouldve thought of that. Now, another problem with my divs (just a mock-up template; my first time not using tables) is getting the #leftCol and #mainCol side-by-side. Any ideas?
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" />
    <html>
    <head>
    <style type="text/css">
      html,body{height:100%;}
      div{border:1px solid #000000;width:40px;}
      #leftCol        {display:inline;}
        #leftCol_top  {}
        #leftCol_mid  { height:50%; }
        #leftCol_bot  {}
      #mainCol        {display:inline;}
        #mainCol_top  {}
        #mainCol_logo {}
        #mainCol_menu {}
        #mainCol_location {}
        #mainCol_contContainer {}
    </style>
    </head>
    <body>
    <!--..................................LEFT COLUMN..-->
    <div id="leftCol">
      <div id="leftCol_top">a
      </div>
      <div id="leftCol_mid">s
      </div>
      <div id="leftCol_bot">d
      </div>
    </div>
    <!--...................................MAIN COLUMN..-->
    <div id="mainCol">
      <div id="mainCol_top">f
      </div>
      <div id="mainCol_logo">g
      </div>
      <div id="mainCol_menu">h
      </div>
      <div id="mainCol_location">j
      </div>
      <div id="mainCol_contContainer">k
      </div>
    </div>
    </body>
    </html>
    Just call me Crash...
    "Crash- and BURN!"
    -Cereal Killer

  • #4
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    Don't change their display. float: left
    leftCol, and you're fine.

  • #5
    Regular Coder
    Join Date
    Aug 2002
    Location
    IN, USA
    Posts
    121
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks you mucho.
    Just call me Crash...
    "Crash- and BURN!"
    -Cereal Killer


  •  

    Posting Permissions

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