[CSS] Text links, rechts, oben, unten
Markus Emde
- css
0 ChrisB
Hallo zusammen,
ich versuche jetzt schon lange vergeblich, selbst auf die Lösung zu kommen. Was ich möchte ist folgendes :
Zwei DIV's nebeneinander, im linken soll der Text links unten, im rechten rechts oben stehen.
Folgenden Code gibt es als Vorgabe :
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
.divleft {
width: 200px;
float: left;
line-height: 200px;
vertical-align: bottom;
text-align: left;
}
.divright {
width: 200px;
float: right;
vertical-align: top;
line-height: 200px;
text-align: right;
}
.divmain {
width: 400px;
}
-->
</style>
</head>
<body>
<div class="divmain">
<div class="divleft">
hallo1
</div>
<div class="divright">
hallo2
</div>
</div>
</body>
</html>
Was ist falsch ? Wo ist der Denkfehler ?
Danke,
Markus
Hi,
Wo ist der Denkfehler ?
Der Denkfehler ist, vertical-align haben bei einem Block-Element wie Div die gewuenschte Auswirkung - hat es nach Definition aber nicht.
Du koenntest per display aus dem Div ein Tabellenelement machen - kann der IE aber AFAIK auch in Version 7 noch nicht.
line-height kann bei einzeiligen Texten helfen - das crasht aber wirklich unschoen, wenn der Text doch mal mehrzeilig wird. Ein padding-top ist in dem Fall nicht ganz so schlimm.
Ansonsten bleibt noch absolut-relative Positionierung.
MfG ChrisB