Welcome to WebmasterWorld Guest from 54.197.142.249

Forum Moderators: incrediBILL

Message Too Old, No Replies

Standardising Page Size for different resolutions

Help required for beginner

   
10:18 pm on Jan 15, 2009 (gmt 0)

5+ Year Member



I am fairly new to HTML and have developed a simple site without much software help (an old version of FP2000) on a 1024 width resolution.
When I view this site on machines with greater resolution e.g. 1280 my pictures are tiled to fill the gap and text windows stretched.
I would like assistance to determine how to contain my page to a 1024 width even though the browser may have a greater width.
I would like to do this either via the style sheet or HTML code if possible.
Many thanks in advance for your valuable help
PS - this is my first post - so treat me gently!
3:27 pm on Jan 16, 2009 (gmt 0)

10+ Year Member



Hi Herman, welcome to WebmasterWorld!

I'm afraid that you don't have enough information to let you know what to do (Is the site built using tables or css for example?).

If you are using tables then set the outter most table a width:

<table width="1024px">

If you're using CSS then set the width in the outter container.

If the images are background images then there should be an option to set them to no-repeat.

4:49 pm on Jan 16, 2009 (gmt 0)

WebmasterWorld Administrator phranque is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



i'm not sure if this is exactly what you are looking for, but the Web Developer add-on for firefox has a resizer that you can set for spefic screen resolutions.
for example a while back i was testing something for small screens so i had some settings for low res - 800x600 and "smartphone" - 329x329.
9:53 am on Jan 19, 2009 (gmt 0)

5+ Year Member



Thankyou all for your responses. The site is built with a mixture of tables and CSS (as I was learning how to use CSS). The CSS mostly controls the colours, fonts etc and all table controls are in the code. I designed my site on 1024 width and did not test how this would display on 800. Would it be best to resdesign the whole site on an 800 width and leave "white" space on either side or persevere with the 1024 width. I was really wishing to know whether it was possible to build in intelligence that would detect the resolution of the browser used and re-size appropriately - but this is probably beyond my skills at present. Thanks again.
1:49 pm on Jan 19, 2009 (gmt 0)

WebmasterWorld Senior Member piatkow is a WebmasterWorld Top Contributor of All Time 5+ Year Member



When you get to larger resolutions are less likely to have their browser set to fill the screen anyway. If you have a good design for an 800px width then I would say go for it.
4:24 pm on Jan 19, 2009 (gmt 0)

WebmasterWorld Administrator phranque is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



welcome to WebmasterWorld [webmasterworld.com], Herman_TG!

for a start, you can set body width like this:
<style type="text/css">
body
{
width: 1024px
}
</style>

i would suggest using something more like 1008px or less so that if the content is long enough to require a vertical scrollbar it doesn't also introduce a horizontal scrollbar.
(statement assuming 1024px wide laptop display for example)

it's also possible to use javascript to determine screen width from the DOM and dynamically reset the width of elements based on that.

4:31 pm on Jan 19, 2009 (gmt 0)

WebmasterWorld Senior Member korkus2000 is a WebmasterWorld Top Contributor of All Time 10+ Year Member



A little off topic but, like phranque mentioned on a 1024 resolution you have the browser chrome and the possibility of a scroll bar. This means you have less than 1024 to really play with. The web safe area for 1024 res is usually 955px to hit all browser differences with chrome and scroll bar width.
4:37 pm on Jan 19, 2009 (gmt 0)

WebmasterWorld Administrator phranque is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



69px seems like a lot for chrome and scrollbar, but i probably haven't tested as many browsers as k2k.
as long as you get the idea...
8:30 pm on Jan 19, 2009 (gmt 0)

5+ Year Member



Thanks all for your very valued responses - now time to have a go........
6:14 am on Jan 20, 2009 (gmt 0)

WebmasterWorld Senior Member swa66 is a WebmasterWorld Top Contributor of All Time 10+ Year Member



I'm not sure about the rest of you, but I hardly ever have a browser full screen.
(1920px wide is just way too much)
Actually I mostly have the window about half of the width of the screen, about 800px wide or so, it leaves the rest of the screen to do useful stuff.
Long lines are very hard to read ...

I was really wishing to know whether it was possible to build in intelligence that would detect the resolution of the browser used and re-size appropriately - but this is probably beyond my skills at present.

Actually there is nifty stuff being implemented in browsers, if you use CSS:
[webmasterworld.com...]