The new forums will be named Coin Return (based on the most recent vote)! You can check on the status and timeline of the transition to the new forums here.
The Guiding Principles and New Rules document is now in effect.
CSS problem
EWom
Registered User regular
Registered User regular
So I need to make a table for a client who wants very small & neat borders shown. Additionally they only want horizontal borders, but not vertical borders.
To solve this I used a spacing <tr> in between content <tr>'s to put in a horizontal line, and to make the lines very small and neat I used in my CSS sheet
table.neat {
border-collapse: collapse;
}
and it works great! Except in IE 6 through 8, I still get a sliver of the inset style of border which I haven't been able to get rid of, without messing up everything else about the tables borders.
Any hints or ideas on how to make IE not be a dick?
To solve this I used a spacing <tr> in between content <tr>'s to put in a horizontal line, and to make the lines very small and neat I used in my CSS sheet
table.neat {
border-collapse: collapse;
}
and it works great! Except in IE 6 through 8, I still get a sliver of the inset style of border which I haven't been able to get rid of, without messing up everything else about the tables borders.
Any hints or ideas on how to make IE not be a dick?
Whether they find a life there or not, I think Jupiter should be called an enemy planet.
EWom on
0
Posts
Remove the extra <tr>
table.neat tr + tr {
border-top: 1px solid #color;
}
where 1px is the width of the border and color is the hex of the color. What that selector is doing is saying, every table row that is the next sibling of a table row (all but the first) should have a border on the top.
EDIT: I should mention that adjacent sibling selectors do not work in IE6. But pretty much nothing does, which is why IE6 is no longer widely supported.
If you're actually displaying a table of data and not using it for layout, disregard!
If it looks great in everything else, and the site is usable still in IE6, you have done your job.
It sounds like it's plenty readable/usable still.
Yeah I just hate that every time I find some new and awesome web programming trick, it takes IE like 2 versions later to support it. Fucking IE, can't keep up with the times. Sometimes you can find little "fixes" that you can set for just IE to work, and sometimes you can't. I honestly can't think of a single time when something worked in IE but didn't work in FF Opera or Safari. But half the time I'm making a website some version (and not always 6) of IE will have to bitch about it.
Just in case you don't know, you can do IE-specific style fixes by using <!--[if IE]> and/or <!--[if IE 6]> to call additional stylesheets after the main one.
This is the opposite of the problem. Microsoft was way ahead of the times with IE6. Because the standards group was taking forever they kinda said, "screw you guys. we're doing vendor prefixes". IE6 is over 9 years old at this point. Firefox 1.0 was released in 2004 and I'm sure would suck even more to try to support.
IE7 now, fuck that shit.
Regarding what Atheraal said conditional comments are awesome. The best way I've used them is to load a new stylesheet based on IE version or even better, add wrapping divs with classes like "ie6" around the page content.
You can also special case attributes on a rule with prefixes;
selector {
*color: red;
_color: blue;
}
This would cause IE7 to render in red, and IE6 to render in blue. The asterix hits IE7 and below and the underscore hits IE6 and below.