ScrollMaster Posted October 26, 2005 Share Posted October 26, 2005 Here is my goal. I want to create a table, or either div tag that will have the height to the bottom of the page.But of course having height:100%; does nothing of the sort. What is the simplest method to achieve this? I want it to hit the bottom of the brower wherever it is and I am quite sure it should be possible without javascriptplease somone enlighten me. Link to comment Share on other sites More sharing options...
actionsketch Posted October 27, 2005 Share Posted October 27, 2005 height: 100%; Link to comment Share on other sites More sharing options...
ScrollMaster Posted October 27, 2005 Author Share Posted October 27, 2005 height=100% does not work. Link to comment Share on other sites More sharing options...
maelstorm Posted October 27, 2005 Share Posted October 27, 2005 Here is my goal. I want to create a table, or either div tag that will have the height to the bottom of the page.But of course having height:100%; does nothing of the sort. What is the simplest method to achieve this? I want it to hit the bottom of the brower wherever it is and I am quite sure it should be possible without javascriptplease somone enlighten me. <{POST_SNAPBACK}> Just be giving the table width will not show any change add a empty <td> tagIs that what u wanted???<HTML> <BODY> <table width="100%" bgcolor="#ffff66" height="100%" border="0"> <tr> <td></td> </tr> </table> </BODY></HTML> Link to comment Share on other sites More sharing options...
ScrollMaster Posted October 28, 2005 Author Share Posted October 28, 2005 nope sorry. I think Im explaining it poorly. I just want it so that my div tag is scaled to the top of the browers to the bottom. If I create a div tag and want it to take up a 100% of the browers current height it doesnt. it just goes auto and only is the height that is needed. Link to comment Share on other sites More sharing options...
actionsketch Posted October 28, 2005 Share Posted October 28, 2005 I just tried it... this will do exactly what you're asking for...<div style="height:100%; border: 1px solid red;">test</div>I added the border so that you can visually see that it is indeed taking up the entire browser window. If it's inset a little, zero-out the margins and padding for the div and the body. Link to comment Share on other sites More sharing options...
jherzog Posted October 31, 2005 Share Posted October 31, 2005 I have had the problem before myself and never found a solutions. This was the most enlighting article I found at the time. I hope I am not violating a rule by posting another page here but it does go into this subject in depth.http://www.quirksmode.org/css/100percheight.htmlJed Link to comment Share on other sites More sharing options...
zeehond Posted November 3, 2005 Share Posted November 3, 2005 I have had the problem before myself and never found a solutions. This was the most enlighting article I found at the time. I hope I am not violating a rule by posting another page here but it does go into this subject in depth.http://www.quirksmode.org/css/100percheight.htmlJed<{POST_SNAPBACK}> <html><style type="text/css"><!-- html, body { height:100%; }body { margin:0; padding:0; }div.mainDiv { position:relative; min-height:100%; height:100%; width:400px; background-color:#F00; }/* mozilla hax \*/html>body div.mainDiv{ height:auto;}/* mozilla hax */--></style><body> <div class="mainDiv"> content Text </div> </body></html> Link to comment Share on other sites More sharing options...
rlmEEna Posted November 4, 2005 Share Posted November 4, 2005 i think its working.. ^^ Link to comment Share on other sites More sharing options...
zeehond Posted November 4, 2005 Share Posted November 4, 2005 i think its working.. ^^<{POST_SNAPBACK}> Link to comment Share on other sites More sharing options...
ScrollMaster Posted November 16, 2005 Author Share Posted November 16, 2005 I reviewing what you posted and I believe this is the solution. Thank you for your help. Link to comment Share on other sites More sharing options...
Skemcin Posted November 17, 2005 Share Posted November 17, 2005 will those mozilla hax validate? I'm using:"-moz-border-radius:5px 5px 0px 0px;"on my site and that is the only thing that keeps my CSS from validating. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now