Im Content-Bereich seht ihr eine Grafik, umrandet mit Textabschnitten. Dies ist bis jetzt eine Tabelle nach folgendem Aufbau:
+---------+---------+
| 1 | 2 |
+----+----+----+----+
| 3 | B | 4 |
| +---------+ |
| | 5 | |
+----+---------+----+
3 und 4 können nicht die Höhe von b+5 haben, sie werden immer so groß wie ihr Inhalt, wenn dieses verhalten nicht gewünscht wird, wird das ganze eine DIV Suppe.
ansonsten könnte eine Lösung in etwa so aus ausehen:
<style type="text/css">
body
{
padding:0 12.5%;
margin:0;
background-color: #fff;
}
#ol
{
width:49.9%;
background-color: #ffe;
}
#or
{
width:49.9%;
background-color: #ff9;
text-align:right;
}
#links
{
float:left;
width: 5em;
}
#rechts
{
float:right;
width: 5em;
}
p
{
margin:0 5.1em;
padding: 0;
background-color: #ff0;
border:1px solid black;
text-align:center;
}
</style>
<body >
<span id="ol"> 1 </span>
<span id="or"> 2 </span>
<div id="links"> 3 </div>
<div id="rechts"> 4 </div>
<p><img src="x.gif"> <br>
5 </p>
</body>
In dem Browser der mir grad zu Verfügung steht (IE 4) ist das zwar nicht perfekt, aber in etwa sollte es hinhauen.
Struppi.