CODEWITHSUNDEEP
htmlcssstylesheetcss-tables
JasonV
JasonV

Reputation: 596

Border gone from table?

For some reason, one of the inside borders disappears on my table whenever I change the default height with some CSS.

HTML:

<table class="event">
  <tr>
    <td>Start Date</td>
    <td>2009-6-2</td>
  </tr>
  <tr>
    <td>End Date</td>
    <td>2009-6-8</td>
  </tr>
  <tr>
    <td>Location</td>
    <td>Vail</td>
  </tr>
</table>

CSS:

table.event
{
  border-collapse: collapse;
  border: 1px solid #000;
  width: 33%;
  height: 300px;
}

table.event td
{
  border: 1px solid #000;
  padding: 2px;
}

Here's what it currently looks like

http://img410.imageshack.us/img410/394/whatv.png http://img410.imageshack.us/img410/394/whatv.png

Anybody have any ideas on how I can fix this problem?

Upvotes: 2

Views: 622

Answers (3)

JasonV
JasonV

Reputation: 596

Just solved the problem. Jeez, I feel like an idiot. The reason this was happening was because I was "zoomed out" a little bit in Firefox. The scaling got rid of one of the inside borders.

Thanks to all for the help, It was Jason Heine's idea that eventually lead to me figuring it out.

Upvotes: 1

CodeLikeBeaker
CodeLikeBeaker

Reputation: 21312

If you take your code and put it directly in a blank html page, does it work? I am wondering if there is something outside causing it, perhapes in a different CSS (just guessing).

I pulled this open in FF, Safari, Opera, Chrome, IE6-7 and 8 and could not replicate it.

Even with/without out the border-collapse i get the same results.

Upvotes: 6

ryanulit
ryanulit

Reputation: 5001

That code works fine for me in firefox and ie7. Are you changing the height with javascript or something else, or just within the editor? However, you could try getting rid of border-collapse.

Upvotes: 0

Related Questions