Tabelle mit Datum am oberen Rand

[Headhunter4711]

Hallo Forum,
ich bin neu hier und ein absoluter Beginner, was HTML angeht!
Meine Frage:
Ich habe eine Tabelle mit 2 Zellen. In der ersten Zelle steht ein Datum, in der nächsten Zelle eine Bezeichnung. Nun ist die Bezeichnung manchmal 2 – 3 – 4 oder 5 Zeilen groß. HTML lässt das Datum in der Zelle davor aber immer MITTIG stehen, das sieht nach meiner Meinung jedoch sehr doof aus.
Wie bekomme ich es hin, dass mir das Datum an den oberen Rand der Zelle gestellt wird?

MfG

HANS

 

[Banana_Jones]

Mit der CSS-Eigenschaft "vertical-align: top"

 

[Headhunter4711]

Moin moin,
vielen Dank für deine Hilfe - Wie ich schon oben geschrieben habe, bin ich absoluter Neuling in HTML-
Ich hab mir viel durch kopieren und einfügen - Versuch und Irrtum - erlesen und erarbeitet.

Eine CSS habe ich mir auch erstellt - jedoch denke ich mal, die Tabelle wurde dabei nicht formatiert

Hier mal der Code meiner "main.css"

/* HTML5 HACK -------------------------------------- */
header, section, footer, aside, nav, article {
display: block;
}

#content {
padding: 10px;
width: auto;
}
/* LAYOUT ------------------------------------------ */
body {
background: #fff;
font-size: 12px;
color: #444;
font-family: Verdana, Arial, sans-serif;
margin: 0;
padding: 0;
}
#doc {
background:#a1a1a1;
width: 800px;
margin: 0 auto;
padding: 0;}
/* HEADER & NAVIGATION ------------------------------ */
#header {
background: #333;
padding: 0 15px;
}
#header h1 {
margin: 0;
padding: 15px 0;
color: #FFF;
text-align: center;
}
#header nav ul {
list-style-type: none;
font-weight: bold;
margin: 0;
padding: 0;
}

#header nav ul li {
display: inline;
margin: 0;
padding: 0;
}

#header nav ul li a {
display: inline-block;
padding: 2px 10px;
color: #fff;
background-color: #CC3366;
text-decoration: none;
}
#header nav ul li.active a,
#header nav ul li a:hover {
background-color: #fff;
color: #444;
}
/* CONTENT ------------------------------------------ */
section {
width: 760px;
padding: 0 15px;
margin: 0 0 0 0;
float: left;
}
#ende{
padding-bottom: 50px;
}
/* SIDEBAR ------------------------------------------ */
aside {
width: 300px;
padding: 0 15px;
margin: 0 0 0 0;
float: left;
}
#bild1{
width: 150px;
height: 150px;
padding-bottom: 50px;
}
/* FOOTER ------------------------------------------ */
footer {
clear: both;
background: #333;
text-align: left;
padding: 10px 15px;
margin: 10px 0 0 0;
}
footer a {
color: #999;
}


Eventuell kannst du mir ja weiterhelfen?

MfG

HANS

 

[soulxheart]

Hallo Headhunter4711

Richtig, deine Tabelle wird mit dem Stylesheet nicht formatiert. Das liegt daran, dass du für die Tabelle keine Eigenschaften definiert hast.

Versuch es mal so, wie auch Banana_Jones geschrieben hat:

table tr td.datum {
     vertical-align:top;
}

Ich habe hier der Zelle (td) eine Klasse datum vergeben. Diese musst du natürlich im HTML-Code in der Tabelle ebenfalls setzen.

Hier das Ganze noch ausführlich erklärt:
SELFHTML: HTML/XHTML / Tabellen / Gestaltung einer Tabelle (unter Ausrichtung von Zellen)



Grüsse