Forum Moderators: not2easy

Message Too Old, No Replies

border-top not displaying in ie

         

catent

2:35 pm on Jul 31, 2008 (gmt 0)

10+ Year Member



Hi

I'm new to css and trying to create my first web site.

In my shop i have products displayed using a table. In the individual row I'm displaying a blue 1px solid line on the top border.

tr {
border-top: solid 1px #0000ff;
}

This works in Firefox but not IE.

Any help will be appreciated.

Kind regards

Teresa

D_Blackwell

5:03 pm on Jul 31, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



You can trick IE into rendering the visual that you want. Collapse the borders on the table, assign the border-top to the <td> and it will display as if a <tr>. You can still adjust the look of the whole thing with padding and such. Don't work a whole lot with tables, so you may get a prettier solution from someone else. This works though. You could also make the 'fix/hack' an IE conditional so that the nice clean code can be kept separate from the ugliness:))

table {
border-collapse: collapse;
}
table {
margin: 1em;
}
td {
border-top: 1px solid #00f; font-size: 1.1em; padding: .4em;
}