• Welcome to Free PC Help, a free PC Help forum to get help with your computer problems.

    Free PC Help is a community that offers free computer help and support for all users, all ages, worldwide.

    In order to start asking questions or contribute on someone else's post you will first need to register. Don't worry - it's quick and easy and once you have registered you will have instant access to the entire forum.

    If you do decide to join the forums you will not have the option to send Private Messages [ PMs ] or add a Signature until you have made 5 posts or more. This is an attempt to try to stop Spammers using the PM system or adding links to their Signature.

HTML QUERY

BJD88

FPCH Member
Joined
Feb 7, 2009
Location
Es***, UK
PC Experience
Hi guys!

So i'm making a new website for my workplace and really confused about webpage sizing. I've designed a homepage in photoshop following a tutorial that uses a width of 1020px - which displays perfectly on my 1680px screen. Now what im confused about is how to 'scale' the webpage down to fit a common user's pc screen with a resolution of say 1024 x 768px :confused::eek: i've tested my current design in the computers at work which use the 1024 width resolution and the page displays in its pre-defined size of 1020px (basically filling the entire screen) but the design is focused on a centered layout and shouldnt fill the whole screen if you understand what I mean.

The easiest way to describe what im after is a way of displaying my site with a reduced zoom percentage on 1024px screens in order for the layout to show properly. (sorry if that doesn't help at all :eek:)

user screen_wrong.jpg So this is how the website is displayed on a 1024px wide screen (graphics width is 1020px). Content completely fills the page.

user screen_correct.jpg This is how I want the website to be displayed on the 1024px wide screen.

If anyone could point me in the right direction about solving this I would be so grateful. I work for a school and it would be great for us to have a half-decent site up and running as the current one is fairly aged now!

regards, BJD
 

RandyL

Administrator
Joined
Jan 22, 2003
Location
USA, Nebraska
PC Experience
Very Experienced
A fixed width, which is what you are using, is just that. The size is fixed. So depending on what users display settings are or what size screen, remember the old CRT monitors? then the page may fill the screen, may not fill the screen or even be to big for the screen which would mean sideways scrolling.

Using percentages for the width is the secret. Set them at less then 100%.

Without seeing your source code I don't know where or how you are setting your widths.

I can give you one example though. If your page is setup using tables then you make one large table set at 100%. Then you make smaller tables inside of tables making them less then 100%.

So if you use 70% as your next inside table and center it then that will leave your backround at 15% on both sides which totals 100%.

Using this method will utilize the full screen of everyones computer without sideways scrolling and give you your unused margins on the sides.

If you go to Page>View Source you can copy the code and paste it here. Unfortunately I only have minor experience in Pure HTML. If it is set up with CSS for instance I wouldn't have a clue. I also have no experience using Photoshop to create web pages.
 
Top Bottom