Help! CSS!

[venta]

Update: problem solved now, see comment to chrisvenus

I have here a bunch of scary, autogenerated HTML. I have a stylesheet which firmly says that inside a particular class:

white-space: nowrap;

The class thingy always appears inside a table's <td> element.

My generated HTML diplays beautifully in Firefox, all nicely on one line as I want it to be.

The compiled HTML I'm building from it, however, has the text wrapped. Which, in the circumstances, is very bad. I've established that other things in the same stylesheet are definitely being applied correctly.

Wait a minute...

<checks IE>

Yup, the straight HTML displays wrongly in IE as well.

So... IE and M$'s HTML compiling tool both ignore the nowrap attribute.

Googling around, it seems that there can be problems if you specify nowrap and specify table widths. However, as far as I can tell neither my scary autogenerated HTML nor my stylesheet make any remarks about how wide a table should be, or indeed how it should be laid out at all.

Is there anything I can do to make it behave nicely in IE ?

Comments

[chrisvenus]

Is there a possibility of seeing the page in the wild? nowrap has usually behaved well for me as far as I can remember so I'd be interested in seeing what you've got that is confusing it. I can believe that maybe if your table has a lot of content that it could be not wanting to make it wider than the page or something possibly but that's the best I can think of.

[chrisvenus]

Oh, and IE 6 or 7?

[venta.livejournal.com]

7

[venta.livejournal.com]

Sadly, no :(

It's doxygen-generated API documentation for stuff which I can't broadcast. I'll see if I can produce a page which does the same thing, though.

[mister-jack.livejournal.com]

Are you specifying the HTML version at the top the .htm file? IIRC, IE defaults to a "legacy mode" if you're not telling it to use the standard.

[venta.livejournal.com]

No, but I've solved it now, see above :)

[chrisvenus]

Just for kicks you could always try making it "white-space: nowrap !important;" just on the offchance that there is something somewhere overriding. Very unlikely to be the case but you never know. :)

[venta.livejournal.com]

S'OK, problem solved now.

It seems that if you do something like:

<table class="my_class">
<td class="other_class">stuff</td>
...
etc

Then FF will apply properties from my_class to the <td> element as well, but IE won't.

So I can solve it simply by adding the nowrap thingy to other_class's style nonsense as well.

[chrisvenus]

Yeah, that makes sense. It should inherit but I seem to remember fonts worked in a asimilarly funny way in that if you set a font on the body of the page tables would go back to the browser default font so you'd end up setting the font on all td as well. I guess its the same thing here that the browser styles for td somehow override the inheritance of the white-space thang. Personally I'd tend to put the whitespace on the tds anyway since that's where I want it. Though that can get tricker with nested tables since ".my_class td" will match the tds of all subtables as well.

[feanelwa.livejournal.com]

Oh, I was going to suggest that but thought you had probably already done it or somebody would tell me it was wrong. Bugger.

[venta.livejournal.com]

I have extremely limited knowledge of stylesheets. Any advice over and above "are you sure you've actually turned the computer on" is likely to be welcome.

[broadmeadow.livejournal.com]

Someone should really tell MS what the C in CSS stands for!

[venta.livejournal.com]

"Cansei", as I understand it (http://en.wikipedia.org/wiki/Cansei_de_Ser_Sexy).

[venta.livejournal.com]

Sadly, I've been writing a lot of C recently so automatically read that as "not important" :)

Thank you, anyway. If I hadn't been trying to write a page to release into the wild I probably wouldn't have noticed that there was another class hiding in there that I hadn't noticed.

[chrisvenus]

*grin* I know what you mean.

I always find minimum test cases are a great way to find a problem. If nothing else because as you chop stuff out you suddenly realise that you chopped out a chunk and suddenly it was working and then notice the pesky javscript or style declaration or whatever that is causing the problems. :)

[beckyc.livejournal.com]

Is there anything I can do to make it behave nicely in IE ?

Hahahahahah!

Um, sorry, that wasn't very sympathetic of me. It's just that I'm doing a web app design course at the moment, and getting things behaving nicely in IE is just about the hardest thing ever. The single biggest nuisance ever is the way that padding and margins are done differently in IE that causes things to end up in the wrong place, wrapped wrongly and gone wrong and look stupid and...

[chrisvenus]

javascript and third party libraries can be great. jQuery worries about these things when you set style stuff on them and is in addition a fantastically useful javascript library for doing web apps.