Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations sizbut on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Page Width 2
- Thread starter EMax1
- Start date
-
1
- #2
When you're talking about the 'width of the page', what are you thinking of? Because if you do:
That div will be 1024px wide, no matter if user has browser minimized, not maximized, maximized, opened with f11, on 800x600 or 1600x1200. And if your whole page is in that div, then your whole page will behave like that. Is that what you were after?
Code:
<div style="width: 1024px;"></div>If you mean the width of the whole window, you need to open a new window using some javascript like this...
<a href="photo.htm" onclick="window.open('photo.htm', 'Photo', 'toolbar=no, location=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=500'); return false">Click here</a>
This opens up a page called photo.htm in a window 400x500 with no scrollbars which is non-resizable.
Hope this helps.
<a href="photo.htm" onclick="window.open('photo.htm', 'Photo', 'toolbar=no, location=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=500'); return false">Click here</a>
This opens up a page called photo.htm in a window 400x500 with no scrollbars which is non-resizable.
Hope this helps.
- Thread starter
- #4
I designed the page for 800 x 600 pixels, but it is acceptable in 1024 width. Therefore I would like to limit the whole page to a width of 1024pixels, even if the user use a screen that is a lot bigger than this. In this case I do not jnow if your piece of code will do this. Also I need to know ifd the user screen is smaller than 1024pixels, like that I will not 'force' the design to be 1024p wide.
I don't think you need to worry about the viewers screen width. Just set the size of your page's content as suggested, and give the body a complementary background color. People with smaller screens or just smaller browser windows will see a scrollbar. People with larger screens or larger browser windows (I have both, my screen res is 1600x1200, my browser window is almost that big) should simply see the page content neatly inside a colored background.
Tracy Dryden
Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.![[dragon]](/data/assets/smilies/dragon.gif "[dragon] [dragon]")
Tracy Dryden
Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.
I must admit that I am baffled as to what you want. If your page is limited to 800 pixels wide, why do you need to limit it again for 1024? I mean, what is between 800px and 1024px that is so important that could not work between 800 and 1200px?
-
1
- #7
Basically he's after a "max-width" css property.
Jeff
[tt]Jeff's Page [/tt][tt]@[/tt][tt] Code Couch
[/tt]
Jeff
[tt]Jeff's Page [/tt][tt]@[/tt][tt] Code Couch
[/tt]
I think what people are trying to say is that you CAN'T limit how big somebody makes their browser window (unless you open up a new window for them using JS as per my suggestion).
You can DETECT how big somebody's window is......
I'm not sure this would be of much use to you though.
You can DETECT how big somebody's window is......
I'm not sure this would be of much use to you though.
Oh, got it. It was designed with 800px width in mind but is fluid. When it expands to 1024px it still looks good but on higher resolutions it looks ridiculous. Ok, then Jeff is right and max-width is what you're looking for. IE, as usual won't play along and for that browser you need use an expression:
This will work in most modern browsers and degrades nicely since standards compliant browsers ignore the width declaration with expression in it.
Code:
div#container {
width: 100%;
max-width: 1024px;
width: expression(document.body.clientWidth > 1024 ? "1024px": "100%" );
}- Thread starter
- #10
Vragabond, you got it, this is my problem.
I am going to try to use your code-but where should I put it?
Also, I am going to retrieve the value width of the user windows and limit it if necessary.
I can see some pieces of code that will allows me to do this.
Thanks to all.
I am going to try to use your code-but where should I put it?
Also, I am going to retrieve the value width of the user windows and limit it if necessary.
I can see some pieces of code that will allows me to do this.
Thanks to all.
You would put the CSS that Vragabond posted in the head section of the HTML page. You would wrap it in style tags (or link to an external stylesheet with the code in it).
Here is a very primitive example showing where you would place the CSS in a regular HTML document:
Cheers,
Jeff
[tt]Jeff's Page [/tt][tt]@[/tt][tt] Code Couch
[/tt]
Here is a very primitive example showing where you would place the CSS in a regular HTML document:
Code:
<html>
<head>
<title>Blah</title>
<style type="text/css">
div#container {
width: 100%;
max-width: 1024px;
width: expression(document.body.clientWidth > 1024 ? "1024px": "100%" );
}
</style>
</head>
<body>
...
</body>
</html>Cheers,
Jeff
[tt]Jeff's Page [/tt][tt]@[/tt][tt] Code Couch
[/tt]
- Status
Similar threads
- Locked
- Question