Solved

When resizing browser, all page content bunches up

Posted on 2004-04-07
9
206 Views
Last Modified: 2010-04-06
I'm building an e-commerce site in 1024x768 resolution, which probably has something to do with it. But, whenever I view the site, if my browser window is anything less than full screen, everything on my site crunches together.  When I resize the browser window to smaller, it's like everything tries to fit in the screen instead of just staying put. I built a previous site in the same resolution and it did the same thing. HELP! Thanks
0
Comment
Question by:jackman045
9 Comments
 

Expert Comment

by:dave_the_brave
ID: 10781840
Can you post some code or a link to your page so we can see what happens?

Are you using StyleSheets (CSS)? You can specificaly set the width, height and position of any object. You can either specify it in px, in, cm, etc. or relative measurements %, em, ex. If you are using % for example, it will resize along with the window size. Well, it is a little more complicated than that. But generaly speaking, that's the case.
With absolute measurements such as px (pixel), the content won't resize, causing scroll bars to appear, if you didn't hide them.

Here's a pretty good article: http://www.webreference.com/html/tutorial18/

The site has more stuff. Take a look: http://www.webreference.com/html/tutorials/
0
 
LVL 1

Expert Comment

by:Leroyski
ID: 10781987
My piece of advice: a website designed specificly for one resolution, is a BAD website. Especially for the resolution 1024 x 768; there are still many people using resolution 800 x 600.

Efficient ways of achieving a website that 'fits' regardless of resolution, is to use mostly percentage widths, or to use a width that is certain to fit in any resolution, for example, trying not to exced a total width of 750 pixels on your website.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 10784852
If you want a rigid page (poor design) and you are assuming that your visitors are all going to use 1024 resolution (about 35% do), then right after the body tage create a rigid frame work like this:

<body>
<div style="width:1024px">
the rest of your code
</div>
</body>

That should pretty much make things stay in place and will just add scrollbars when the page does not fit.  There might be some minor quirks for positioned elements, but thos can be dealt with on a one be one basis.

Cd&
0
Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

 

Expert Comment

by:acraig1
ID: 10792872
If you want to maintain position on the screen you can use stye to absolutely position your items on the screen so they do not move.  Put the following item in your tag.
style="Z-INDEX: 101; LEFT: 189px; POSITION: absolute; TOP: 15px"

Modify the style for each tag to change the position of each item.
0
 
LVL 1

Expert Comment

by:paradise45
ID: 10876584
I face this problem before. One thing which i think it may usefull to you.

Create a table which is using width = 1024. Then put all your content in the table. So that, the content will not resize when you resize the ie.

Hope it may help you.....
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 12554754
There is good information here, but it is not possible to determine if any of it help, as the user took the irresponsible approach of neither replying to any of the comments or supplying the addition information requested.  So, PAQ with no refund IMHO.

Cd&
0
 

Accepted Solution

by:
modulo earned 0 total points
ID: 12624008
PAQed with no points refunded (of 125)

modulo
Community Support Moderator
0

Featured Post

Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

Question has a verified solution.

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

Suggested Solutions

Preface In the first article: A Better Website Login System (http://www.experts-exchange.com/A_2902.html) I introduced the EE Collaborative Login System and its intended purpose. In this article I will discuss some of the design consideratio…
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

803 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