[2 days left] What’s wrong with your cloud strategy? Learn why multicloud solutions matter with Nimble Storage.Register Now

x
?
Solved

Maintain Site Display Size Despite Size of Monitor

Posted on 2006-07-12
4
Medium Priority
?
300 Views
Last Modified: 2010-04-25
I'm trying to make it so my site displays the same size on different monitors. For example, on my computer the website appears how I want it, but on others it may appear larger than life itself. I realize that it will vary in different browsers and on different monitor sizes but I wonder if there is a way around this problem. I would like to hear a great suggestion on how to fix this problem - no matter how elementary it is. Please describe the process in detail or provide a link to a possible solution. Thanks.
0
Comment
Question by:AllHale
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 17096965
Hi AllHale,
 
I'm not sure I understand what you want.  Do you want the site to take up the same percentage of the screen no matter the monitor size or do you want the site to have the same width no matter the monitor size?

In either case, this is easy to do with a pure CSS design or a table-based design.  The former uses a CSS or table container set to percentage width and the latter uses a CSS or table container set to fixed pixel width.

Here's a couple of examples:

Percentage width: http://www.oswd.org/design/preview/id/2828

Fixed width: http://www.oswd.org/design/preview/id/2485
0
 

Author Comment

by:AllHale
ID: 17102688
I definitely want to take up the same percentage of the screen despite a change in monitor size. Is there a tutorial on creating the site in CSS design, I shy away from CSS now, but if it yields better results maybe I should throw myself into it.
0
 
LVL 70

Accepted Solution

by:
Jason C. Levine earned 2000 total points
ID: 17102850
There are TONS of tutorials on CSS design.  Just google around until you find one you like.   It's not that CSS yields better results for what you are asking here, but it can do more than table-based design can.  Using tables to layout the site is fast becoming a no-no in web design so it is worth looking into CSS.

For this specific thing, all you would need to do is wrap all of the content of the page in a div or a one-cell, one-column table and set the width of that container to whatever % of the screen size you prefer and then make all other elements inside of that container % relative to the container.  The exception would be navigation bars (those should be defined as static widths).

So instead of defining a 760 pixel width with a 100 left and a 660 pixel right column, you would define a 80% container with a 100 pixel left box and let the right box take up the rest of the space.  As we are getting to specific code, I will leave off here unless you have more specific questions.
0
 

Author Comment

by:AllHale
ID: 17102913
No that's good enough for now. I'll try to do what you suggested and see if it solves my problem. Thanks again Jason, you're the best.
0

Featured Post

Enroll in October's Free Course of the Month

Do you work with and analyze data? Enroll in October's Course of the Month for 7+ hours of SQL training, allowing you to quickly and efficiently store or retrieve data. It's free for Premium Members, Team Accounts, and Qualified Experts!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Adobe Dreamweaver CS5 is a WYSIWYG web page editor that has advanced HTML, CSS, and Javascript rendering functionality and is probably the most well-known HTML editor available. Much of Dreamweaver's appeal centers around the Design View interfac…
This article is very specific and is only intended to help if you are installing Dreamweaver 8 in a Windows 7 environment with Office 2007 installed.   I'm not sure why Microsoft tends to release OS' that should not be released but they do.  Windows…
This tutorial will teach you the special effect of super speed similar to the fictional character Wally West aka "The Flash" After Shake : http://www.videocopilot.net/presets/after_shake/ All lightning effects with instructions : http://www.mediaf…
Please read the paragraph below before following the instructions in the video — there are important caveats in the paragraph that I did not mention in the video. If your PaperPort 12 or PaperPort 14 is failing to start, or crashing, or hanging, …
Suggested Courses

649 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question