This time, though, Google isn't helping, and my web designer friends have never heard of the problem and have no idea.
The CSS property
white-space lets you control how web browsers deal with white space in the HTML source of a bunch of text. Normally, browsers collapse all strings of consecutive whitespace (spaces, tabs, newlines) into single spaces, then wrap text to fit within the box or window - that's white-space: normal, and is the default for most tags. If you apply the style white-space: pre, then the browser will display all white space exactly as it is in the source, preserving your newlines and extra spaces and tabs - that's the default for <pre> tags. A third possibility is white-space: nowrap, which is not the default for any tag. If you apply that style, the browser will still collapse all consecutive whitespace (including newlines) into a single space, but it won't wrap text, so linebreaks appear in the display only where tags like <br /> tell the browser to put them. (CSS 2.1 adds two more values, pre-wrap and pre-line, but I don't know how many browsers support those)I have a list on a web site where I want to prevent the browser from wrapping text, so I applied
white-space: nowrap to the list's class, and that works beautifully in every browser I tested with. But then, I needed to add a few paragraphs in some places inside this list, that should auto-wrap. So I applied the style white-space: normal to just those paragraphs. And in most browsers, that works - the list (the container block) is still "nowrap", but the paragraphs (blocks inside the list) are "normal" and autowrap.But not in Internet Explorer. Whether I apply
white-space: normal from the stylesheet in the .css file, or explicitly in the tag (<p style="white-space: normal">), IE seems to ignore it. The "pre" style of the container tag gets inherited, and the paragraphs stretch out several screenwidths to the right.Have any of you encountered this? Do you know of any workarounds short of brute-force splitting up into lots of little separate blocks? Do you know any web designers who are good with CSS that you could send this link to?
Update: the solution
Failing to recognize "white-space: normal" was an IE5 bug. IE6 can run in "quirks mode", where it emulates IE5 CSS bugs, or "standards mode", where it tries to do the right thing. Putting a DOCTYPE definition at the top of the page, specifying a recent standard document type definition like HTML4 or XHTML1, should put IE6 in "standards mode", and I do indeed have DOCTYPE definitions at the tops of my pages. However, I recently also added the xml prolog (
<?xml version='1.0' encoding='iso-8859-1'?>) to my pages. That's what you're supposed to do for XHTML, but little did I know that,- In Explorer 6 Windows, Microsoft implemented one extra rule: if a doctype that triggers strict mode is preceded by an xml prolog, the page shows in quirks mode. This was done to allow web developers to achieve valid pages (which require a doctype) but nonetheless stay in quirks mode.
