ich hab die divsuppe mal gelesen, sehr aufschlußreich.
danke für den link.
also das ist nun mein ergebnis, leider noch ein kleiner fehler (ul passt sich der höhe nicht an).
vielleicht könnte mir dabei jemand helfen.
ein hinweis wäre schon viel.
mein code:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<TITLE>teaser</TITLE>
<style>
ul.ulteaser, .ulteaser li {
border: 1px solid #000;
}
ul.ulteaser {
width: 412px;
padding: 0 10px 10px 10px;
}
.ulteaser li {
list-style: none;
display: inline;
margin-top: 10px;
padding: 6px 0 10px 0;
width: 200px;
text-align: center;
}
.ulteaser li.liteaserl {
float:left;
}
.ulteaser li.liteaserr {
float:right;
}
.divteaserimg {
clear:both;
width: 150px;
height: 150px;
overflow: hidden;
border: 1px solid #000;
margin-left: 25px;
}
*html .divteaserimg {
margin-left: 0;
}
</style>
</head>
<body>
<ul class="ulteaser">
<li class="liteaserl"><h4>Teaser 1</h4><a href="#"><div class="divteaserimg"><img src="img.jpg" alt="" border="0"></div></a></li>
<li class="liteaserr"><h4>Teaser 2</h4><a href="#"><div class="divteaserimg"><img src="img.jpg" alt="" border="0"></div></a></li>
<li class="liteaserl"><h4>Teaser 3</h4><a href="#"><div class="divteaserimg"><img src="img.jpg" alt="" border="0"></div></a></li>
<li class="liteaserr"><h4>Teaser 4</h4><a href="#"><div class="divteaserimg"><img src="img.jpg" alt="" border="0"></div></a></li>
</ul>
</body>
</html>