Peter,

It's great to see another big player strutting a bit of CSS/Standards muscle!

I really admire what you're trying to do with JavaScript to use a wider layout where possible (with a sensible default), but resizing the browser window (quote a common occurrence I would have thought) can produce some scary results...

Resizing under IE six seems fine (haven't checked 5.x), but Firefox (for example) loses it's navigation bar (left) when resized down from 1024 to 800 wide, and worse still, it can't be scrolled to. In the process, the background image sits in a weird spot (obscuring text), and things like the search box disappear off the right of the screen.

I *think* you might be able to solve the problem in one of two ways:

a) on resize, reload the page (annoying, but it will fix the problem)

b) place a 1px border or padding on the left edge of the layout, which will force your layout to disappear off the right edge of the window only (not the left), which will mean the behaviour is "normal" for a 1024 layout viewed at 800.

I stumbled on option B one day when researching something related to what you're doing. Here's a quick sample:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en-au" lang="en-au">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-15" />
<title>Untitled</title>
<style>
#wrapper {
position: relative;
width: 760px;
margin: 0 auto;
padding: 1px;
}
</style>
</head>
<body>
<div id='wrapper'>
a b c d e f g h i j k l m n o p q r s t u v w x y z
</div>
</body>
</html>


Setting the padding of #wrapper to 0px and resizing to a small window will cause "a b c..." to disapear off the left. But leaving it at 1px will ensure that the left edge of #wrapper doesn't disappear off the left edge of the window.

Your combined Mozilla/Firebird audience looks like at least 34372 unique visitors a day, so it's something you probably want to take a look at :)

---
Justin French
http://indent.com.au

*****************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
*****************************************************




Reply via email to