Meine lieben Leser, die Ihr alle so klug und hübsch seid – vermutlich ist einer von Euch in der Lage, ein CSS-Problem, an dem ich jetzt schon den ganzen Abend rumgrüble zu lösen. So soll es aussehen:

Und so habe ich es bisher versucht:

XHTML:

<div id="header">
<div id="cover"><a href="/"><img src="greyblob.png" alt="grey blob" /></a></div>
<div id="headertext">
<h1><a href="/">Überschrift</a></h1>
<p>Blablabla</p>
</div>
</div>


CSS:

#header {
text-transform:lowercase;
font-family:"Trebuchet MS", Helvetica, Arial, sans-serif;
}
#header #cover {
width:150px;
float:left;
padding-right:10px;
margin-right:10px;
}
#header #headertext {
height:211px;
margin:0 0 0 160px;
padding:0 0 0 10px;
vertical-align:bottom;
}
#header h1 {
font-size:3em;
}
#header h1 a {
color:#111;
text-decoration:none;
}


Mal davon abgesehen, daß die Schriftart anders ist – wo ist mein Denkfehler? Irgendwie will die Überschrift nach unten…