Hi!
Ich habe leider ein Probelm mit CSS: in allen Browsern (neueste Versionen) ausser dem Internet Explorer sieht mein Seitenlayout genauso aus wie ich es möchte. Das letzte "Inhalt" div mit float(right) ist genau dort wo es sein soll (unter dem Logo rechtsbündg). Nur IE macht es aus einem mir unbekannten Grund nicht. Beim IE liegt der "Inahlt" unter dem letzten links gefloatetem Listenelement. Ich habe es schon mit position versucht aber dann stellen es alle anderen Browser falsch dar.
Hier ist mal der Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title></title>
<meta name="description" content="Dieser Beschreibungstext soll einem Anwender im Suchdienst bei Auffinden dieser Datei erscheinen.">
<meta name="author" content="">
<meta name="date" content="2006-03-15">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="expires" content="0">
<style type="text/css"> /*Embedded Cascading Style Sheet*/
body {
color: black; background-color: white;
font-size: 100.01%;
font-family: Helvetica,Arial,sans-serif;
margin: 0; padding: 0;
text-align: left; /* Zentrierung im Internet Explorer */
min-width: 40em; /* Mindestbreite verhindert Anzeigefehler in modernen Browsern */
}
div#Seite {
text-align: left;
vertical-align: top;
margin: 0 auto;
width: 800px;
padding: 0;
background: #cccccc;
border: 2px ridge silver;
/*height: auto;* unnötig?*/
overflow: hidden;
}
h1 {
font-size: 1.5em;
margin: 0; padding: 0.2em 0.2em 0.1em 0.2em;
text-align: left;
background: #ffffff;
border-bottom: 1px solid silver;
}
div#Navilogo {
float:left;
width:160px;
height: 240px;
margin: 0px;
padding: 0px;
}
ul#Navigation {
font-size: 0em;
float: left;
margin: 0px;
padding: 0px;
list-style: none outside;
width:80px;
height: 25px;
border: 0px none;
}
div#Inhalt {
margin: 0;
padding: 0 1em;
float:right;
width:526px;
background-color: #fefafa;
}
* html div#Inhalt {
height: 1em; /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */
margin-bottom: 0;
}
div#Inhalt h2 {
font-size: 1.2em;
margin: 0.2em 0;
color: black;
}
div#Inhalt p {
font-size: 1em;
margin: 1em 0;
}
p#Fusszeile {
clear: both;
font-size: 0.6em;
margin: 0; padding: 0.1em;
text-align: center;
background-color: #fefafa;
border-top: 1px solid silver;
}
</style>
</head>
<body>
<div id="Seite">
<h1><img src="logo.png" alt="Logo"></h1>
<div id="Navilogo">
<img src="navigation.png" width="160" height="240" alt="Navigation Logo" border="0">
</div>
<div>
<ul id="Navigation">
<li><img src="naviempty.png" alt="White Spacer" vspace="0" border="0" width="80" height="25" hspace="0" style="position:relative; left: 0px; top:0px;"></li>
<li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="135" height="25" border="0" style="position:relative; left: -55px; top:0px;"></li>
<li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="120" height="25" border="0" style="position:relative; left: -40px; top:0px;"></li>
<li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="105" height="25" border="0" style="position:relative; left: -25px; top:0px;"></li>
<li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="90" height="25" border="0" style="position:relative; left: -10px; top:0px;"></li>
<li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="80" height="25" border="0" style="position:relative; left: 0px; top:0px;"></li>
<li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="85" height="25" border="0" style="position:relative; left: -5px; top:0px;"></li>
<li><img src="menu.png" alt="Menu" vspace="0" hspace="0" width="90" height="25" border="0" style="position:relative; left: -10px; top:0px;"></li>
</ul>
</div>
<div id="Inhalt">
<h2>BLIBLABLUB</h2>
<p>Blablablablablablablablablablablab lablablablablablablablabladfgdfgdddf
fgdfgdgdf </p>
<p>Bla</p>
<p>Blablablablablablablalbalbalblabla blblbalblablablablablabla lballlb ablabl
albl alb labl alb labl alb alb lab labl alb alb lab lab lablab lablbl blblab
lblalbl alalb lablabl abl albl ablablblabl blalbl ablabl ablabl labla balb
lblbal ll alblabl blalbl lblabl labl albl abl </p>
<p>albl abl allbl lbalblalb labl bl lbal blal blal bla lb fffgdfgdlabl a</p>
<p>bl albl alb lalablalb labla llbal alblalalb lab lbbalbalalb lblalb lbal
lbllarfgbalsfjkhglkjasfdhgc oahg lhg lshghsigs sofhg lshg sdupgf phiuspug
sfpgu psfug spidfug ppisugpi puspigu psufdpigpipusgp rtl ehglksrtlwnrlnrwl
nwelknf lwrlfnwrwjfigfubopi rp pksjfpg wrj pw pw pig jwr jpi gj wrjkögj
lkwpg wrpj pjpwrjg wripj gpwij pj pwrijg pwrj wprij gpwrgpij pwrj pwirj
pijpijwrpigj pwrij piwrjpgj pijwrpi jwrpi jpi
</div>
<p id="Fusszeile">© 2006 Impressum</p>
</div>
</body>
</html>
Ich wäre für jede Hilfe und Korrekturen sehr dankbar. Ich probiere da schon einige Stunden rum aber nichts funktioniert :(
Danke und bis dann,
Raist