margins zwischen boxen im ie falsch (im mozilla richtig)
nicole
- css
Hi Leute
Zwischen den zwei Boxen in meinem Inhaltsbereich fügt der ie zu viel Abstand ein und hat zusätzlich auch rechts beim Menü noch Hintergrundfarbe vom Inhaltsbereich zu viel.
Im Mozilla sieht alles so aus wie es soll ...
Weiß jemand Rat??
Hier die url:
http://www.lunaticsol.de/kleine_welten/freunde.htm
Hier der CSS Code, es geht um textboxleft und textboxright!
/* CSS Document */
body {
background-color: #e8eae6;
margin-top: 0;
margin-bottom: 0;
text-align: center ;
background: #ccc url(hg/spacer.gif) repeat-y 50% 0;
}
div#layout {
width: 1024px;
text-align: left;
margin-right: auto;
margin-left: auto;
}
/* Inhalts DIV */
div#comtent {
margin-left: 0px;
text-align: left;
}
/* Teile des Inhalts */
.textboxleft {
float: left;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
letter-spacing: 0pt;
text-transform: none;
line-height: 17px;
color: #2f3e1a;
width: 320px;
margin-right: 30px;
margin-left: 36px;
}
.textboxright {
float: right;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
letter-spacing: 0pt;
text-transform: none;
line-height: 17px;
color: #2f3e1a;
width: 320px;
margin-left: 0px;
margin-right: 36px;
}
div span {font-weight: bold;}
div h2 {font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
letter-spacing: 0pt;
text-transform: none;
line-height: 17px;
color: #2f3e1a;
margin-bottom: 0px;}
div p {font-weight: normal;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
letter-spacing: 0pt;
text-transform: none;
line-height: 17px;
color: #2f3e1a;
margin-top: 10px; }
a:link {
color: #5d6970;font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;line-height: 17px;text-decoration: none;
}
a:visited {
color: #5d6970;font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;line-height: 17px;text-decoration: none;
}
a:hover {
color: #8c959b;font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;line-height: 17px;text-decoration: none;
}
a:active{
color: #8c959b;font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;line-height: 17px;text-decoration: none;
}
/* Menu */
div#menu {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
letter-spacing: 0pt;
color: #2f3e1a;
width: 162px;
margin-right: 20px;
margin-top: 0px;
padding-top: 250px;
padding-left: 0px;
padding-bottom: 15px;
margin-bottom: 0px;
float: right;
div#secondnavigation {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
letter-spacing: 0pt;
color: #2f3e1a;
text-transform: none;
line-height: 12px;
margin-top: 0px;
padding-left: 15px;
}
Hallo :)
Zwischen den zwei Boxen in meinem Inhaltsbereich fügt der ie zu viel Abstand ein und hat zusätzlich auch rechts beim Menü noch Hintergrundfarbe vom Inhaltsbereich zu viel.
/* Menu */
div#menu {
Hier fehlt die schließende Klammer.
Vielleicht zeigt der IE das div deshalb breiter als FF?
Andere Unterschiede kann ich nicht erkennen.
mfg
cygnus
Hi cygnus,
die Klammer hab ich ergänzt. Aber die Abstände sind im IE immer noch anders. Zumindest bei mir hier zeigt der IE links neben dem Menübereich noch einen schmalen Bereich an, der die gleiche Farbe hat wie der Inhaltsbereich.
... als wenn die divs im Inhaltsbereich mit ihren margins das ganze nach rechts rausschieben würden.
Danke
Nicole
Hallo :)
Im IE7 sieht es jetzt korrekt aus,
aber nun stellt der FF3 falsch dar ...
CSS-Datei:
/* Inhalts DIV */
div#comtent {
margin-left: 0px;
text-align: left;
}
Da ist noch einer: Statt comtent sollte es wohl content heißen ...
Das kann nicht funktionieren.
Einige style-Angaben sind in der CSS-Datei, andere im Quelltext, beispielsweise im div content (dort mit n geschrieben).
Ich würde die style-Angaben aus dem Quelltext herausnehmen und auch in die CSS-Datei packen, schon allein der besseren Übersicht wegen.
mfg
cygnus