nicht angemeldet
Lösche die inneren <div>...
Sieht schon besser aus!
Ich hatte die <div> u.a. gesetzt weil in SELFHTML (allerdings zu "position") folgendes steht:
"Weder Netscape noch der MS Internet Explorer interpretieren Angaben zur absoluten Positionierung in allen HTML-Elementen. Um eine maximale Abwärtskompatibilität zu erreichen, ist es am besten, Angaben zur Positionierung auf das div-Element zu beschränken. Schließen Sie andere Elemente, etwa Textabsätze, Grafiken, Tabellen, Formulare usw. einfach in entsprechende div-Elemente ein."
...und formatiere die Listen direkt, insbesondere mit passenden Werten für "margin" und "padding".
Den Text habe ich ja hinbekommen, aber bei den Grafiken habe ich unten und an beiden Seiten 2px transparenten "Rand". Woher kommt der denn? Mit border, margin und padding bekomme ich ihn jedenfalls nicht weg...
Der Code (mit farbigen "border" zum checken) sieht jetzt so aus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>CSS-Test</title>
<style type="text/css">
<!--
body { background:#f5f5f5 url(images/lines.gif); color:#000000;
font:12px Verdana,Arial,Helvetica,sans-serif;
height:100%; margin:0px; padding:0px 10px }
#pagehead { background:#FBD9B6; border-top:0px; border-right:0px;
border-left:0px; border-bottom:1px solid #333333;
color:#000000; margin:0px auto; padding:0px; width:100% }
#text { background:transparent; float:left; border:1px dotted Blue;
list-style:none; margin:4px 0px 0px 10px; padding:0px; vertical-align:bottom }
#text li { display:inline }
#tabs { background:transparent; float:right; list-style:none;
margin:0px; padding:0px; border:1px dotted Red }
#tabs li { display:inline }
-->
</style>
</head>
<body>
<div id="pagehead">
<ul id="text">
<li>Text1</li>
<li>Text2</li>
</ul>
<ul id="tabs">
<li><img src="tab.gif" width="80" height="20" alt="Nr.1" title="Nr.1" /></li>
<li><img src="tab.gif" width="80" height="20" alt="Nr.2" title="Nr.2" /></li>
<li><img src="tab.gif" width="30" height="16" alt="Nr.3" title="Nr.3" /></li>
<li><img src="tab.gif" width="30" height="16" alt="Nr.4" title="Nr.4" /></li>
</ul>
</div><!-- END pagehead -->
</body>
</html>