| |||||||||
![]() |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
|
#1
|
|||
|
|||
|
scaling web page to fit all viewers
Help! I've found some resources regarding fitting our web pages (www.trustedvoice.com) to suit any viewer's screen resolution, but the experiments I've tried don't work. I know about sizing tables in percent rather than pixels (http://trustedvoice.com/faq.htm looks good on my monitor), but many of my web pages don't HAVE tables. I want a viewer not to have to scroll off to the sides to read text, regardless of their browser. My pages look decent on my monitor, but not on some others. Any clever suggestions, things I might have missed?
Gratefully, -D |
|
#2
|
|||
|
|||
|
Code:
<body> <div style="width: 100%; margin: 0; padding: 0"> ... (your content here) ... </div> </body> That's the easiest way I've found to do it. |
|
#3
|
||||
|
||||
|
If you worked with the box-model rather than tables, you could make use of max-width, min-width, max-height, and min-height.
|
|
#4
|
|||
|
|||
|
I have tried...
...the 100% width also, without luck. I have tables in my header and footer and if I put 100% width they look great in my browser, but if I go to the lowest res. it looks bad. Does this have anything to do with the fact I am on my computer for both, should I go to another comp. to try it?
I have been trying to make my site more centered on the page with side margins. It's looking alittle better, but some scrolling is still needed on a couple of the pages. |
|
#5
|
|||
|
|||
|
Ahhhhhhhhhhh. I see why now. (Sorry, missed it before since it looked like a series of images to me.)
It's got nothing to do with the width="100%" (although that is correct). Your header image is absolutely huge in terms of width (927 pixels.) When working with a page, remember that the minimum width a user's browser window will need to be to fit everything is equal to the sum totals of of any widths defined in terms of pixels (vs. percentages) on any horizontal plane. For example, if you have two table cells of width 200 pixels each, and then on the same horizontal plane you have an image that's 300 pixels wide, then the minimum browser window size would need to be 200 + 200 + 300 = 700 pixels. That image could easily be broken up into two smaller images. Just make the logo about a quarter of the size that it is now and then leave your two other graphics on the right. For the middle, simply leave it blank. To see what I'm talking about, go to http://216.89.218.233/tscst The logo is on the left, the little girl's pic is on the right with some pics (that still need to be updated but that's a redesign in progress). After that, it's just a background pattern. |
![]() |
| Viewing: ASP Free Forums > Web Design > Web Layout > scaling web page to fit all viewers |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
|