FrOzeN Posted October 5, 2006 Share Posted October 5, 2006 I want the page to take up 100%, except for 70px padding either side. But when a user resizes it so small that the middle* section is only the width of the banner, I then want the padding to become resized, and once it reaches 0px it then creates a horizontal scrollbar.middle* - being the page body excluding the side padding.http://www.clananthrax.net/example2.htmlAs seen above, it's quite easily achieved with a table, but I'm wondering if I can set this up the same using a <div> instead?(The blue border is just to determine where the middle section sides are whilst working with it.) Quote Link to comment Share on other sites More sharing options...
dbrimlow Posted October 8, 2006 Share Posted October 8, 2006 Sounds like you want a "liquid" or "floating" layout. Not easy if you don't know how and even then you need to cheat by seeing how someone else does it.Here is a liquid layout I am working on that works in all browsers including IE 5.23 for Mac! http://www.regisresidential.com/Feel free to copy the css and layout.Here is something similar that blows up in IE 5.5 and below, but works fine in every other:http://www.regisresidential.com/page2.htmlHere is a less flexible, more px based fixed fonts and widths with a non graphic corner rounding technique, displays dynamic database driven content without using table cells Works in all browser versions (except IE 5.5 and below don't like using the rounded corner divs).This is great for dynamic database content using php (not finished using a regex to filter the php url paths yet, but the layout is flexible while fixed to a certain extent):http://www.regisresidential.com/rounded2b.php Quote Link to comment Share on other sites More sharing options...
ToonMariner Posted October 8, 2006 Share Posted October 8, 2006 Set the width of your div to a value that would leave the desired margin (about 90%) then give that div a margin...margin: 10px auto;This will yeild a fluid page, give you some nice whitespace eitherside until the window is reduced - the page will only go as small as the banner shoudl teh user attempt to reduce size further the dreaded bottom scrollbar will appera Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.