Tables in IE do not have border when border = 0 in a css reset?

Question

In my css file, I have a reset where I am setting the border:0. This causes all tables in IE, not firefox to have no border. Even if I set the border inline on the table, it still does not show in IE. Does anyone know the solution to this?

Part of the rest:

table, img
{
   border:0;
}

<table border="1">
<tr>
<td></td>
</tr>
</table>

Border shows up in firefox, but not in IE. Do I have to do style="border:1px solid black" in the table instead of border="1"

Answer 1

have you tried

table {border-collapse: collapse;}

EDIT: wait, you're trying to get rid of the border or add it? Now I'm confused...

Answer 2

If you want a border you shouldn't set the border to 0. Try this instead:

table{
   border: 2px;
}

That should work out better.

EDIT:

If you want to do it inline, you should do

<table border="2px">

Answer 3

Assuming that there's no typo in your code (in the question), have you tried adding a measurement unit to the inline setting?

<table border="1px">

For example?

Elsewise, try using CSS to re-/activate the borders:

<table style="border: 1px solid #000;"> <!-- or use a stylesheet, or style block, obviously -->

Have you checked that you're using a standards-compliant doctype declaration, and not lapsing into quirks-mode?

Answer 4

A couple standards-compliant ways to specify no border in css are:

border-width:0; border-style:none;

Table elements, td elements and th elements all accept borders so a safe way to ensure no borders at all would be table, td, th {border-style:none;}.

table {border-collapse:collapse;} is a purely css way of removing spacing between cells

Check out w3schools.com or w3.org for standards-compliant css tips

Answer 5

Your example table has nothing in it. IE decides it has no content and so does not show the "border="1" attribute.

Reset with

table {
  border:none;
}

Then use:

<table style="border:solid 1px #000;>
<tr><td>x</td></tr>
</table>

Answer 6

If you want that specific table to have a border, I would just give it a class:

table, img
{
   border:0;
}
table.something
{
    border: solid 1px #000000;
}

<table class="something">
  <tr>
    <td></td>
  </tr>
</table>

That should work in all browsers.