myownslave Posted August 2, 2006 Share Posted August 2, 2006 I have 4 stlye sheets, one underneath the other. The bottom (CONTENT) one is the main content area, and I want so set the height of this style sheet so that it just automatically comes down to fit the remainder of the page. Basically, regardless of the window size or screen resolution, I want the bottom edge of that style sheet to touch the bottom of the window, no higher, no lower. Below is my code, any idea how I could change it to get what I'm after?<?XML version="1.0" encoding="UTF-8"?><!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/XHTML11/DTD/XHTML11.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><HEAD><META http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/><TITLE>THE FENIANS GAA CLUB - News</TITLE><META name="Author" content="Jim Broderick"/><STYLE type="text/css"> BODY { margin:15px 0px; border:0; padding:0px; width:100%; height:100%; max-height:100%; background:#000099; text-align:center; font-family:arial, verdana, sans-serif; font-size:0.8em; overflow:hidden; } #HEADER { top:0px; left:0px; right:0px; width:100%; margin-top:0px; margin-bottom:15px; height:90px; overflow:hidden; background:#FFFFFF; } #MENU { padding:0px 15px; top:0px; margin:0px auto; margin-bottom:15px; height:25px; width:764px; overflow:hidden; background:#000000; text-align:center; } #CONTENTHEADER { top:0px; margin:0px auto; width:764px; height:40px; padding:15px; overflow:hidden; background:#FFFFFF; text-align:center; } #CONTENT { top:0px; margin:0px auto; width:764px; height:40%; padding:15px; background:#FFFFFF; text-align:left; text-indent:40px; overflow:auto; } </STYLE></HEAD><BODY><FONT color="#000000" face=Verdana><DIV id="HEADER">Here's where the header/branding image will be...</DIV><DIV id="MENU">This will be where the menu resides...</DIV><DIV id="CONTENTHEADER">This is just another text area that acts as an intro to the main content area...</DIV><DIV id="CONTENT">This is the main content area<BR>I want the bottom edge of this style sheet to touch automatically come down to touch the bottom of the browser window. How could I set the height so that this will happen?</DIV></FONT></BODY></HTML> Link to comment Share on other sites More sharing options...
senza sicura Posted August 2, 2006 Share Posted August 2, 2006 well, it depends on the screen resolution, if a user is goint 800*600, you should put height: 800px; ... if is a user with a screen 1024*768, you should put height: 1024px; and don't remember to put:margin-bottom: 0px;good luck! Link to comment Share on other sites More sharing options...
myownslave Posted August 3, 2006 Author Share Posted August 3, 2006 well, it depends on the screen resolution, if a user is goint 800*600, you should put height: 800px; ... if is a user with a screen 1024*768, you should put height: 1024px; and don't remember to put:margin-bottom: 0px;good luck!Well that's the problem - I'm wondering if there is any way of programming it so that it will fit the window size regardless of the screen resolution. I have no way of knowing what resolution the end user will have, and I want to be able to accommodate all screen resolutions.And height:100%; will not work because I have three other style sheets in the same window, and I have the size for each of those set in pixels rather than in percent. Link to comment Share on other sites More sharing options...
aspnetguy Posted August 3, 2006 Share Posted August 3, 2006 the easiaet was is to "simulate" the effect with background images.Look at this page I made http://71.7.150.39/asp/xs/if you look at my XHTML and CSS you will see I have very little XHTML code because I chose to not fight the inconsistancies of each browser but used a centered y-axis repeating body background image.Feel free to copy the code for testing. 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