Tabelle mit CSS

    Moin!

    Bin Anfänger und möchte mit CSS eine Tabelle erstellen. Dabei soll die Hintergrundfarbe und die BottomLine durchgezogen sein. Stattdessen macht er trotzdem Freiraum zwischen die einzelnen Zellen. Was muss ich in die CSS Definitionen noch reinschreiben?

    Vielen Dank!


    HTML
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>Tabellen Test</title><style type="text/css">
table {    border: 0px solid black;    border-spacing: 0px;    color: black;}table thead tr {    font-family: Verdana, Geneva, sans-serif;    font-size:14px;}table thead tr th {    border-bottom: 2px solid black;    margin: 0px;    padding: 2px;    background-color:#999;}table tr {    font-family:Verdana, Geneva, sans-serif;    font-size: 14px;    background-color: white;}table tr.odd {     background-color:#CCC;}table tr td,th {    border-bottom: 1px solid black;    padding:2px;}</style></head>
<body>            <table summary="Summary">            <caption>Caption</caption>              <thead><tr>                <th scope="col">Head</th>                <th scope="col">Gead</th>                <th scope="col">Head</th>                <th scope="col">Head</th>                </tr>                </thead>                <tr>                <td>Daten</td>                <td>Daten</td>                <td>Daten</td>                <td>Daten</td>                </tr>                <tr class="odd">                <td>Daten</td>                <td>Daten</td>                <td>Daten</td>                <td>Daten</td>                </tr>                <tr>                <td>Daten</td>                <td>Daten</td>                <td>Daten</td>                <td>Daten</td>                </tr>              </table></body></html>

    Edit: Entschuldigung für die komische Formatierung!

    Hab "border-collapse mal reingeschrieben und unten ein Foto wie die Tabelle aussieht.

    HTML
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>Tabellen Test</title><style type="text/css">
th: header-cell: Text is bold and centered.td: Standard/Data-cell: Text is regular and left aligned.
table {    border: 0px solid black;    border-collapse:collapse;    border-spacing: 0px;    color: black;}table thead tr {    font-family: Verdana, Geneva, sans-serif;    font-size:14px;}table thead tr th {    border-bottom: 2px solid black;    margin: 0px;    padding: 2px;    background-color:#999;}table tr {    font-family:Verdana, Geneva, sans-serif;    font-size: 14px;    background-color: white;}table tr.odd {     background-color:#CCC;}table tr td,th {    border-bottom: 1px solid black;    padding:2px;}</style></head>
<body>    <table summary="Summary">    <caption>Caption</caption>    <thead><tr>    <th scope="col">Heim</th>    <th scope="col">Gast</th>    <th scope="col">S&auml;tze</th>    <th scope="col">B&auml;lle</th>    </tr>    </thead>    <tr>    <td>Daten</td>    <td>Daten</td>    <td>Daten</td>    <td>Daten</td>    </tr>    <tr class="odd">    <td>Daten</td>    <td>Daten</td>    <td>Daten</td>    <td>Daten</td>    </tr>    <tr>    <td>Daten</td>    <td>Daten</td>    <td>Daten</td>    <td>Daten</td>    </tr>    </table></body></html>


    Ich weiß nicht warum der Codes durcheinander ist. Geändert hat sich mit border-collapse aber nichts...

    Hab mir deinen Quellcode mal kopiert und beim Einfügen in den Editor war der CSS-Code nicht valide. Da steht mitten drinne noch irgendetwas was dort nicht reingehört. Mit welchem Editor hast Du den geschrieben? Ich würde dir empfehlen deinen Editor zu kontrollieren oder zu wechseln - dann klappt es auch mit einem vernünftigen CSS-Code.