If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Junior Member
    Join Date
    Apr 2010
    Member #
    hi all,

    I'm making a gaming website with/for friends, I designed it in photoshop and then sliced it up , created html and images and then edited it in dreamweaver, and it looks fine on my screen but friends with smaller monitors say they have to scroll.

    Iv search around and done some tutorials about changing the widths to 100% and lower percentages but it always remains the same, i made my web browser window smaller to test it and still cant get it to work. I want it so that the page is visible on any screen size and any screen resolution, they have the same reesolution as me but guys on 17" screens have to scroll and us with 22" screens do not, im consfused.

    I have attached the file.

    Hopefully I can find an answer.

    Thanks Again.

    Craig Guest.


  3. #2
    Member WPExplorer's Avatar
    Join Date
    Apr 2010
    Member #
    The attachement isn't really much of a help as all the images are not attached to the file, so all we can see are lines...

    But I guess from what I can see though is that you are using some fairly old methods of web design. I am also assuming that when you say "scroll" you mean horizontally?

    In any case I find that adding all your sites content into a fixed width wrapper of around 900px is a good size for most monitors (although it's the resolution mainly not the actual monitor size...mostly). Such as follows:

    #wrapper{ margin: 0 auto; width: 900px }

    Putting everything into this div container will keep your site centered and narrow enough for almost anyone to check it out without having to scroll.

    hope this helped.

  4. #3
    Junior Member
    Join Date
    Apr 2010
    Member #
    What you're trying to accomplish is very difficult. You can't really design a site to work in all screen resolutions (you can, but that's Javascript and multiple style sheets). Usually it's easier just to design by average resolution.

    The average screen resolution is 1024 x 768. So go back to your initial design and re-size it for those dimensions. That's the best thing.

    Looks to me like you built a giant table, which isn't standard practice anymore. I recommend that you use 'liquid' design for the structure: Use divs and set your widths and heights as percentages, rather than pixels. Percentage means that it's a percentage of the browser window. When every element on the page has a fixed size and width, it's going to get ugly when it goes to a smaller screen.

    Part of your stretching issue is your navigation. Each TD has a fixed width of 167 or 168px. I added up your TDs and they take up 997 px. then You've got two columns on each side with a width of 100%.

    Start with your table as 100% width. the side columns get 20% each. So with your side columns taking up 40%, that gives you 60% left. Give each cell in your navigation a width of 10%.

    Don't let any cells add up to more than 100%. Browsers get angry when that happens.

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
All times are GMT -6. The time now is 12:21 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: