Forum Moderators: not2easy
I know that IE ignores the CSS "max-width" property, so I thought I'd try this:
<SCRIPT type="text/javascript">
if (document.body.clientWidth > 1024) {document.body.style.width='1024px';}
</SCRIPT>
Which, like max-width, seems to work in all browsers *except* IE.
I can't easily test on IE because I'm traveling with my Mac laptop and don't have easy access to a Windows machine with a large display. I used BrowserCam to grab a picture of IE loading the page at 1200xSomething, but the width wasn't limited. So come to think of it, because I can't easily test, I don't know which part of my code is failing -- the test for the size of the window, or setting the width of the <body>.
There's an old thread here about limiting page width in IE with a JavaScript "expression" that you put in your CSS declarations, but surely there's got to be an easier way to simply set the width of the <body>?
Marshall
(1) I didn't think IE supported max-width anywhere.
(2) I'm not trying to set the width of a DIV, I'm trying to set the width of the body element.
(3) If the body's width can be set then that's what I prefer to do, because it's a lot easier for me to drop that code onto every page with SSI, rather than insert a <div> at the top and bottom of each of my many pages. (Yes, I could figure out how to automate it somehow, but I'm trying to take the path of least resistance.)
(4) I can't easily try that anyway because my free trial expired on the site that lets me see how my site looks in IE, and I'd like to avoid paying for a sub that I may need only for a day if I can help it. This seems like a common enough issue that I figured someone here would have the answer.
And of course, I'd be willing to test something in a Mac browser for someone who doesn't have access to a Mac.
Marshall
You'll have to compute the exact value which triggers the style. You'll have to add border and margin width. Grab the bottom-right corner of the window and resize it to check if it works correctly.
Here is an example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>#body {
border: 1px solid green;
max-width: 500px;
width: expression(document.body.clientWidth>500+2?'500px':'auto');
}</style>
</head>
<body>
<div id="body">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.<br>
<br>
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.<br>
<br>
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.<br>
<br>
Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
</div>
</body>
</html>
You won't be able to apply the max-width IE-trick directly to the body element....
Thanks. But like I said, I'm not trying to apply max-width directly to the body element, since I know that won't work. I'm trying to apply the plain *width* to the body element. That's the method I prefer to use, if IE supports it. Can anyone confirm whether IE supports setting the plain *width* of the body element? And if so, then what am I doing wrong?
[edited by: Achernar at 11:24 pm (utc) on Oct. 1, 2007]
I don't want to go into the reasons I'm not using a doc type, so let's please not let this thread get derailed into people trying to convince me why I should.
What I'd like to know is, is it possible to set the width of the <body> tag in IE, if I'm not using a doc type?
I don't want to go into the reasons I'm not using a doc type, so let's please not let this thread get derailed into people trying to convince me why I should.
Understood. However, you may find FAQ: Choosing the best doctype for your site [webmasterworld.com] useful :)
...
<style>
#body {width:1000px;}
</style>
</head>
<body>
<div id="body">
...
