How to fix the WebPage height in different resolutions of screens?

Hi all,

I want to fix the height of the webpage that fits to the browsers height (for small pages).

That is, for some resolutions or some wider screens it will show white background or some default background, if the page is less than the height of the browser… At that time i want to fix the height of the page, for any browser for any resolutions/screens…

How to make it flexible…

Give me the suggestions or standards to follow it…
Thank you…

You’d need JavaScript for that, but it’s a bad idea, really. Keep it simple, dude. That’s my advice. Pick a body background color and let that be the color of your footer to avoid the white space at the bottom on tall screens, and let your pages find their own natural height.

Thank you ralph.m.
Can you give me an example to show how it should be…

Scripting nothing – it sounds like he’s asking about 100% min-height layouts…

Though admittedly, I may be having difficulty deciphering the Engrish… since I’m guessing wildly at his meaning.

Could we get an example code, with maybe a pic of what it’s doing you don’t like and a mockup of what you want? Your terminology seems off, and your sentence structure is confusing me greatly.

Thank you for your reply…

Some of my site web pages are very small. When i develop that pages initially, it is fit to my working system browser height…

After development, when i see the same page in other screens/monitors with different resolutions, it is not fit for their system browser’s height… it is small when compare to the browser’s height…

How to fix it.

Well, it sounds like you’re making the normal mistake of designing to one screen size instead of fluid – you may want to also consider adding more content to your pages.

Ok, let’s look at one of the sites in your signature – I’m seeing a decent amount of content – a bit text heavy but not bad in that department – but…

You’ve got a fixed width layout, undersized px metric fonts which are an accessibility /FAIL/, and a general lack of padding and expanded line-heights not only making it harder to read, but also not filling things out as much as possible or even in a consistent manner.

I’m assuming you’re referring to how on a 1920x1200 display your pages stop and the body background shows through – one ‘fix’ to that is what’s called a min-height layout – where the white is extended down and the footer moved to the bottom of the screen. This would give you a big empty white space on really tall displays, but appearance-wise that’s often preferable to having the background show – especially if you’re designing with the page flush top. Applying a bit of padding up top so the background shows all-around is another approach to making that not look quite so odd.

Under the hood you’ve got bigger problems – like HTML more suited to fifteen years ago than today. No doctype means hacking around IE being in quirks mode, building a page in Frontpage being no way to build a website, knee deep in javascript doing CSS’ job, still checking for nyetscape 4 – something coders stopped doing eight years ago, etc, etc…

I’m assuming that RFDesign.info is a 8 or ten year old site that’s not been updated? Do you have a more recent page in mind that has the problem you’re having? Most of how people build sites today couldn’t even be applied to the pages in your signature as it’s all decade out of date methodologies… and frankly miserable failures in terms of accessibility.

ya, you are right…

but am not flexible with HTML.
I want to solve this problem, because i am embedding the HTML tags in the php code…

You can give me an working example to resolve this problem?

Thank you…