Member Avatar for andre1011

I have a <div> that will not extend all the way down the page even with the height set to 100% on the <html> and <body> and the div itself. It will not display correctly in ie7 or firefox.

I have an external style sheet but this is basicly the structure of the page

<html>
<head>
<body>
   <div id="wrapper">
      <div id="colWrapper">
      </div>
   </div>
</body>
</head>
</html>

CSS:

html {height:100%;}
          body{height:100%;}
          #wrapper{height:100%;}
          #colWrapper{height:100%}

I would like any help someone can give me thanks

  • 3 Contributors
  • 3 Replies
  • 92 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by andre1011
Member Avatar for amigura

it works ok on ie7 and opera for me. 1 is not a ff user.

<html>
<head>
<style type="text/css">
html {height:100%;}
          body{height:100%;  background:#0066FF}
          #wrapper{height:100%; background:red}
          #colWrapper{height:100%; width:80%; background:yellow}
</style>

</head>		  
<body>
   <div id="wrapper"> wrapper text
      <div id="colWrapper"> colWrapper text
      </div>
   </div>
</body>
</html>
Member Avatar for MidiMagic

Generally you can't control the vertical height of a screen object to match the size of the browser window. This is because there are too many possibilities among different browsers and window sizes.

Div is also very poorly designed and implemented. It generally assumes the height of the tallest object inside it.

Member Avatar for andre1011

Thanks I got it to work in ie6 still working on firefox

it works ok on ie7 and opera for me. 1 is not a ff user.

<html>
<head>
<style type="text/css">
html {height:100%;}
          body{height:100%;  background:#0066FF}
          #wrapper{height:100%; background:red}
          #colWrapper{height:100%; width:80%; background:yellow}
</style>

</head>		  
<body>
   <div id="wrapper"> wrapper text
      <div id="colWrapper"> colWrapper text
      </div>
   </div>
</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.