CODEWITHSUNDEEP
htmlcss
Fabio Reims
Fabio Reims

Reputation: 95

CSS Table is affected by a other stylesheet

I got a short question about css and a topic that i dont know that much about. Its the style.css of a website that affects other tables. Here is an example:

http://myreclaim.de/

As you can see, the navigation got spaces between the sliced parts and a white border. This is the code:

<table id="Tabelle_01" width="980" height="110" border="0" cellpadding="0" cellspacing="0">
<tr>
    <td colspan="7">
        <img src="http://myreclaim.de/navigation/images/navigation_01.png" width="980" height="31" alt=""></td>
</tr>
<tr>
    <td rowspan="2">
        <img src="http://myreclaim.de/navigation/images/navigation_02.png" width="266" height="79" alt=""></td>
    <td>
        <a href="#"><img src="http://myreclaim.de/navigation/images/navigation_03.jpg" width="104" height="45" alt=""></a></td>
    <td>
        <a href="http://board.myreclaim.de/"><img src="http://myreclaim.de/navigation/images/navigation_04.jpg" width="91" height="45" alt=""></a></td>
    <td>
        <a href="http://board.myreclaim.de/index.php/BoardList/"><img src="http://myreclaim.de/navigation/images/navigation_05.jpg" width="63" height="45" alt=""></a></td>
    <td>
        <a href="http://board.myreclaim.de/index.php/MembersList/"><img src="http://myreclaim.de/navigation/images/navigation_06.jpg" width="88" height="45" alt=""></a></td>
    <td>
        <a href="http://board.myreclaim.de/index.php/MembersList/"><img src="http://myreclaim.de/navigation/images/navigation_07.jpg" width="80" height="45" alt=""></a></td>
    <td rowspan="2">
        <img src="http://myreclaim.de/navigation/images/navigation_08.png" width="288" height="79" alt=""></td>
</tr>
<tr>
    <td colspan="5">
        <img src="http://myreclaim.de/navigation/images/navigation_09.png" width="426" height="34" alt=""></td>
</tr>

From my point of view it should work due to the fact that it got a as far as i know, unique ID and a border, cellpadding and cellspacing of 0. In Adobe DW it looks as it is supposed to.

I really appreciate a nudge in the right direction!

Upvotes: 0

Views: 44

Answers (3)

haim770
haim770

Reputation: 49095

Try to override the table rules in your stylesheet:

#Tabelle_01 { 
    border-collapse: collapse; 
    border: 0; 
}

#Tabelle_01 td { 
    padding: 0; 
    border: 0; 
}

Upvotes: 1

Ricardo Cino
Ricardo Cino

Reputation: 131

In the file http://myreclaim.de/wp-content/themes/elite/style.css?ver=4.0.1 , you have 3 lines that are changing your table. 

table{width: 100%; max-width:100%; margin-bottom: 30px; border:1px solid #ddd;}
table th{ padding: 10px; text-align: center; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd;}
table td{ padding: 10px; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd;}

If you remove these lines, the problem is solved. Although, you might need these for other tables on your website.

Upvotes: 0

Okx
Okx

Reputation: 363

Use this CSS:

a {
    padding:-Npx;
    margin:-Npx;
}

Where N is a certain number. Keep experimenting with N until you get no spacing between the lines. Remember to keep your numbers negative

Upvotes: 0

Related Questions