• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bei einer Tabelle eine Spalte linksbündig, Rest zentriert!?

harvey4711

Neues Mitglied
Hallo,
ich möchte in einer Tabelle, eine Spalte (Überschrift und Daten) linksbündig schreiben, alle anderen Spalten sollen zentriert sein. Wie muss ich meinen Code ändern?

HTML:
<head>
<style>
table, th, td {
border: 1px solid #fff;
border-collapse: collapse;
font-family: Verdana;
font-size: 18px;
text-align: center;
padding: 5px;
width="100%"
}
img {
border:none
}
</style>
  <title>JKS Ergebnisse</title>
  <link href="../html/hw.css" rel="stylesheet" type="text/css">
</head>

<body>
  <div id="header1">
    <img alt="logo" src="../Daten/Bilder/Sonstige_Bilder/Logo_4x4cm.jpg">
  </div> <!-- header1 -->

  <div id="header2">
    <img alt="head" src="../Daten/Bilder/Banner/JKS_Ergebnisse_Banner.gif">
  </div> <!-- header2 -->

  <div style="clear:both;"></div>
  <!-- header Ende -->

  <div id="navi">
    <ul style="list-style:none;">
      <li><a class="link_start" href="../index.html">start</a></li>
      <li><a class="link_jugend" href="../html/jugendkart.html">jugend</a></li>
    </ul>
  </div> <!-- navi Ende -->

  <div id="content">

    <table>
      <tr>
        <th>Datum</th>
        <th>Veranstaltung</th>
        <th>K1</th>
        <th>K2</th>
        <th>K3</th>
        <th>K4</th>
        <th>K5</th>
        <th>M</th>
      </tr>

      <tr>
        <td>14.04.2013</td>
        <td>S01 - MSC Eilendorf</td>
        <td><a href="../S01_K1_2013.pdf"><img src="../PDF.gif" alt="PDF öffnen"></a></td>
        <td><a href="../S01_K2_2013.pdf"><img src="../PDF.gif" alt="PDF öffnen"></a></td>
        <td><a href="../S01_K3_2013.pdf"><img src="../PDF.gif" alt="PDF öffnen"></a></td>
        <td><a href="../S01_K4_2013.pdf"><img src="../PDF.gif" alt="PDF öffnen"></a></td>
        <td><a href="../S01_K5_2013.pdf"><img src="../PDF.gif" alt="PDF öffnen"></a></td>
        <td><a href="../S01_M_2013.pdf"><img src="../PDF.gif" alt="PDF öffnen"></a></td>
      </tr>

   </table>
  </div> <!-- content Ende -->

</body>
</html>
 
Definiere für alle Spalten, dass deren Inhalte zentriert sind und gib der einen Spalte (in jeder Zeile) eine Klasse über die Du für diese Spalte eine Ausnahme definieren kannst.
 
Alle anderen sind zentriert. Wie meinst Du das mit der Ausnahmeklasse, die definiert werden muss. Kannst Du mir eine Zeile als Beispiel zeigen?
 
Code:
.left_alignment { text-align: left; }
Code:
<td class="left_alignment">14.04.2013</td>
 
HTML:
<td class="links"

Und im CSS

Code:
td { text-align: center; }
td.links { text-align: left; }
 
Klasse funktioniert, allerdings wird die Zelle jetzt breiter. Wie kann ich sie auf einen festen Wert legen. Ich hatte schon mal
HTML:
<td width="10%">
versucht, aber das soll man wohl nicht so machen, oder?
 
Ich habe jetzt folgendes versucht:
HTML:
td.breite { width:10%; }
        <td class="links" class="breite">S01</td>
Wie ist die Syntax, wenn ich zwei Klassen in <td> schreiben möchte? Ich habe es mit Blank und mit Semikolon versucht, beides funktioniert nicht. Nehme ich "links" raus macht er die gewollte Breite. Bitte um Verständnis bei diese Anfängerfragen. Danke.
 
Wie man sie zusammenfassen kann habe ich jetzt gefunden:
HTML:
<td class="links breite">S01</td>
Was ich aber nicht verstehe, eine Spalte davor ist jetzt größer geworden, obwohl nicht mehr drin steht?
 
Zurück
Oben