Hello,
ich bastel derzeit eine Seite nach der "DIV-Variante" ^^
Nun sieht es im IE anders aus als im Firefox und Opera. Aber ich versteh nicht warum.
Quelltextausschnitt:
Vom Prinzip her lässt der IE das div mit der id "right" nicht so nach an den rechten Rand des containers ran. Aber wieso? Kann er doch ruhig machen. Ich hab ja margin: 0px 60px 0px 0px. Aber beim IE ist das viel breiter als beim FF bzw Opera. Ich hab mal margin rechts auf 10px gestellt. Da waren es beim IE mindestens 20px und beim FF normal. Wenn mans aus 0 stellt isses bei beiden ganz rechts... zur Not muss ich es auf 0px setzen und dann padding für rechts setzen. Oder hat einer ne ganz andere Idee!? Vielleicht hab ich ja einen Fehler in der CSS Datei.
ich bastel derzeit eine Seite nach der "DIV-Variante" ^^
Nun sieht es im IE anders aus als im Firefox und Opera. Aber ich versteh nicht warum.
Quelltextausschnitt:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Driftwood - Index</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
/* div { border: 1px solid #000000; } */
body {
background-color: #000000;
/* text-align: center; */
}
#container
{
position: absolute;
background-color: #FFFFFF;
width: 800px;
height: 600px;
top: 50px; left: 200px;
text-align: left;
margin: auto;
margin-left: auto;
margin-right: auto;
}
#header
{
background-color: green;
height: 48px;
margin: 60px 0px 70px 60px;
}
#news
{
background-color: blue;
width: 350px;
height: 150px;
margin: 0px 0px 0px 60px;
}
#NewsText
{
float: right;
width: 240px;
margin: 0px 0px 0px 15px;
}
#NewsDate
{
width: auto;
text-align: right;
/* margin: 0px 5px 0px 0px; */
}
#NewsDetail
{
margin: 20px 0px 0px 0px;
}
.NewsDate { font-family: Arial Black; font-size: 12px; }
.NewsText { font-family: Georgia; font-size: 9px; font-weight: bold; }
.NewsAutor { font-family: Arial; font-size: 10px; color: #7A7B7D; }
#right
{
border: 1px solid #000000;
float: right;
width: 300px;
height: 400px;
margin: 0px 60px 0px 0px;
}
#events
{
background-color: yellow;
width: 300px;
height: 10px;
}
#magazine
{
background-color: black;
position: relative;
width: 300px;
height: 200px;
margin: 20px 0px 0px 0px;
}
#Footer { position: absolute; top: 575px; height: 20px; width: 100%; padding: 0px; text-align: center; clear: both; }
#Footer p { font-family: Arial; font-size: 7pt; padding: 0px; color: #A2A3A4; }
.EventsHead, .EventsHeadPunkt, .MagazinHead, .MagazinHeadPunkt { font-family: Arial; font-size: 9pt; vertical-align: top; }
.EventsHeadPunkt, .EventDatum { color: #009DE0; }
.MagazinHeadPunkt, .MagazinJahr { color: #FAB000; }
.EventDatum, .EventTitle, .EventOrt, .MagazinPDF { font-family: Arial; font-size: 8pt; font-weight: bold; }
.EventTable, .MagazinTable { padding: 0px 0px 0px 10px; width: 100%; }
.EventTable td, .MagazinTable td, .NewsTable td { padding: 0px 0px 0px 0px; }
.EventOrt { color: #7A7B7D; }
img { border: 0; }
#Error
{
width: 500px;
height: auto;
padding: 10px 10px 10px 10px;
border: 1px solid #7A7B7D;
margin: auto;
}
#Error h2 { font-family: Arial; font-size: 11pt; padding: 0px 0px 0px 0px; }
#Error p { font-family: Arial; font-size: 9pt; padding: 0px 0px 0px 0px; }
</style>
</head>
<body>
<div id="container">
<div id="header"><img src="./images/Logo.jpg" alt="" /></div> <div id="right">
<h3 class="EventsHead">Demnächst<span class="EventsHeadPunkt">.</span></h3>
<table class="EventTable">
<tr>
<td class="EventDatum">17.Oktober.06</td><td class="EventTitle">Tanz in den Mai</td><td class="EventOrt">Kapital</td>
</tr>
<tr>
<td class="EventDatum">24.Oktober.06</td><td class="EventTitle">The Lipps Inc.</td><td class="EventOrt">AJZ</td>
</tr>
<tr>
<td class="EventDatum">07.November.06</td><td class="EventTitle">Kante</td><td class="EventOrt">Atomino</td>
</tr>
</table>
<h3 class="MagazinHead">Lads dir<span class="MagazinHeadPunkt">.</span></h3>
<table class="MagazinTable">
<tr>
<td class="MagazinPDF"><img src="./images/PDFIcon.jpg" alt="" /> September <span class="MagazinJahr">2006</span></td>
<td class="MagazinPDF"><img src="./images/PDFIcon.jpg" alt="" /> Mai <span class="MagazinJahr">2006</span></td>
</tr>
<tr>
<td class="MagazinPDF"><img src="./images/PDFIcon.jpg" alt="" /> Juni <span class="MagazinJahr">2006</span></td>
<td class="MagazinPDF"><img src="./images/PDFIcon.jpg" alt="" /> Juni <span class="MagazinJahr">2006</span></td>
</tr>
</table>
</div>
<div id="news">
<table class="NewsTable">
<tr>
<td width="10%" align="right" valign="top">
<p>
<span class="NewsDate">29.09.06<br /></span>
<span class="NewsAutor">alex</span></p></td>
<td width="*" style="padding: 0px 0px 20px 10px"><p><span class="NewsText">Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.</span></p></td>
</tr>
<tr>
<td align="right" valign="top">
<span class="NewsDate">29.09.06<br /></span>
<span class="NewsAutor">alex</span></td>
<td width="*" style="padding: 0px 0px 20px 10px"><span class="NewsText">Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.Juhu ein toller Text, da werden wir sicher ganz fein Freude dran haben. Divs rulen, bis jetzt noch.</span></td>
</tr>
</table>
</div>
<div id="Footer">
<p>Copyright by Marcus Röder & Alexander Müller</p>
</div>
</div>
</body>
</html>Vom Prinzip her lässt der IE das div mit der id "right" nicht so nach an den rechten Rand des containers ran. Aber wieso? Kann er doch ruhig machen. Ich hab ja margin: 0px 60px 0px 0px. Aber beim IE ist das viel breiter als beim FF bzw Opera. Ich hab mal margin rechts auf 10px gestellt. Da waren es beim IE mindestens 20px und beim FF normal. Wenn mans aus 0 stellt isses bei beiden ganz rechts... zur Not muss ich es auf 0px setzen und dann padding für rechts setzen. Oder hat einer ne ganz andere Idee!? Vielleicht hab ich ja einen Fehler in der CSS Datei.
