nicht angemeldet
Hi Thomas,
+----------+--------------------+
| 1 | 2 |
+----------+--------------------+
| | |
| 3 | 4 |
| | |
+----------+--------------------+
| 5 |
+-------------------------------+
Vorschlag:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<title></title>
<style type="text/css">
<!--
div { border:1px solid blue; }
#eins { width:40%; float:left; }
#drei { width:40%; float:left; }
#vier { width:60%; margin-left:40%; position:relative; right:-1px; }
#fuenf { width:100%; clear:left; }
-->
</style>
</head>
<body>
<h1>5 DIVs</h1>
<div id="eins">
<p>eins</p>
</div>
<div id="zwei">
<p>zwei</p>
</div>
<div id="drei">
<p>drei</p>
<p>drei</p>
<p>drei</p>
<p>drei</p>
<p>drei</p>
<p>drei</p>
</div>
<div id="vier">
<p>vier</p>
</div>
<div id="fuenf">
<p>fuenf</p>
</div>
</body>
</html>
- Das ganze soll zentriert und auflösungsunabhängig
sein (ergo %-Werte).
Ist es.
- [3] und [4] habe variable Höhen
Kein Problem.
- [5] soll sich (unabhängig davon welcher der beiden darüber
liegenden Bereiche höher ist) nahtlos unten anschließen.
Macht er dank clear:left
- [4] enthält den eigentlichen Inhalt und soll später nach
Möglichkeit auch von einem DAU mit Text gefüllt werden können.
Deshalb -so die Bitte- möge [4] doch im Quelltext gleich ganz
oben stehen.
Das wird kompliziert. Mit obigem Beispiel kannst du das ganz einfach per float und margin regeln. DIV vier ist etwas breiter, das ergibt sich aus der Kombination der Prozentwerte.
Was jedoch der IE daraus macht, spottet jeder Beschreibung.
Hehe, das glaube ich auf's Wort. Meinen Vorschlag bekommst du mit Attribut-Selektoren wohl eher hin. Allerdings steht #vier nicht ganz oben. Muss das denn unbedingt sein?
LG Orlando