css, anyone?

[astridv]

My little brunch today lasted seven hours. I love brunching! I may not have done any of the countless things I planned to do, but I'm very relaxed (and full). I still didn't get around to reading my friends list. Guess I'll have to take tomorrow off, too. Oh damn :)

Okay, css question: there still remains a little problem regarding the stylesheets. It may come down to nothing more than an ill-located typo (as seems to be the case quite often).

As an example, here's the Quicksearch page of the BBF archive. Between the black border and the text inside, there's supposed to be a 10 pixel wide margin. But in Internet Explorer, that margin just gets ignored. In Firefox it looks fine. I haven't tried it in Netscape or Opera yet.

This is what it looks like when I view it in Firefox (and what it's supposed to look like):


And in Internet Explorer:


Here's the stylesheet.

And this is the part in question, I think:

table.outline {
    background: #ffffff;
    color: #000000;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    margin: 0px;
    border: 3px solid black;
}

If I change the values there, the changes show in Firefox but again, not in IE. Unfortunately I know next to nothing about stylesheets. I have this really cool, comprehensive, three inches thick book about web programming, though. But in this case, that didn't help either. I'm grateful for any suggestions.

Also, I applied a few last-minute changes to the search engine last week; it should work properly now.

Comments

[rahirah]

I don't know if this is any help, but for my site I use the line

cellpadding: 20pt;

and it works fine in both IE and Firefox. (I wanted to use points instead of pixels because I thought that would give it a more consistent look across different screen resolutions.) Is maybe the margin setting overriding the cell padding?

[rahirah]

Or is IE maybe loading a cached version that doesn't show your changes? Are you forcing a refresh?

[astridv.livejournal.com]

Is maybe the margin setting overriding the cell padding?

Don't think so, I tried setting the margin to 10 px, but that didn't work either. Also refreshed constantly, but maybe I need to actually clear the cache in IE as well.

The cellpadding thing you suggest is something new. I'll try that next, thanks!

[rahirah]

Something else I thought of, I have that under table, not under table.outline. Not sure what difference that makes, if any, but just as a data point...

[astridv.livejournal.com]

After trying countless variations I got the sneaking suspicion that maybe IE doesn't support padding. So I googled a bit and found that... IE doesn't support padding. hahahah*sob*.
That cellpadding tag you mentioned works in neither IE nor Firefox, btw. Weird. Did you use it in a css form?

Well, I'm sure there're ways to work around this little problem.
*shoots IE*
I found a few promising sites already. One says, You will no doubt come across many quirky layout issues when building a site with CSS. You'll end up banging your head against a wall time and again.

[rahirah]

Yeah, but on further inspection I see that I've also hard-coded it into all my tables on the regular pages thus:

[table cellpadding="30"]
[tr]
[td] [h2]Vampire Feeding Patterns[/h2]

etc. Except with angle brackets. So I suspect that the version in the css form doesn't do anything, and is an experimental remnant I forgot to take out. :P