Jump to content

Help With Fluid Design


AndyMoireASP
 Share

Recommended Posts

HiI am working on a fluid design application, which works great no matter what my screen resolution is horizontally, but I am not getting it to fit vertically in any resolution. The basis my of the design is to let the browser to fill the gap or subtract when the screen expands and contracts on whatever is the screen resolution. Can someone please explain to me what you need to do to get a page to fit vertically as well as horizontally? I have been banging my head for weeks and I just can't it to work!! I really do need help, please someone help me!!!ThanksHere is my mark up<html><body><div id="fit"><div id="header"><img/><label/><div id="links"><hyperlink/><hyperlink/><hyperlink/></div><div id="timer"><timer/></div></div><div id="menu"><menu/></div><div="footer"><label/></div></div></body></html>CSS#html{height:100%;width:100%;margin:0%;bottom:100%;right:0%;left:0%;}#body{width:100%;height:100%;min-width:40em;min-height:35em;margin:0%;top:0%;right:0%;left:0%;}#header{top:0;width:100%;height:3.5%;bottom:3%;min-height:3em;min-width:40em;position:relative;}#fit{width:100%;height:90.75%;}#menu{width:15%;height:100%;float:left;min-width:9em;min-height:22em;display:inline;}#footer{bottom:100%;height:3.15%;min-width:40em;clear:both;}

Link to comment
Share on other sites

here's a thread you might want to check outhttp://w3schools.invisionzone.com/index.ph...c=25407&hl=
HiThanks for your reply and link, but I think I need your help on this. I looked at the link you sent, and it makes use of tables, and setting the height and widths in pixels. As you can see with my code, I am purely using divs and making use of percentages and ems. From the link, I couldn't quite follow the solution due to pixels and the tables as I was under the impression that we should be using divs for positioning and when resizing for different sized browsers to use percentages.Is there some way you could help me with my code, and/or explain how the solution given in the link works?Thanks
Link to comment
Share on other sites

You should change #html for html and #body for body.A hash (#) indicated that the element has an ID with that name. Meanwhile, simply typing the name selects all elements with that tag name.

Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...