Probleme mit Abständen zwischen den divs bei IE!

Status
Nicht offen für weitere Antworten.

babone

Mitglied
Hallo,
ich habe probleme mit Abständen bei IE. Aber komischerweise nur wenn ich eine Grafik zufüge. Bei Firefox wird es richtig dargestellt. Nach lange rumprobieren und suchen hoffe ich dass Ihr mir vielleicht helfen könnt. Ich lade mal die Grafik mit hoch. Ansonsten enstehen immer Lücken zwischen mlink1 und mlink2, mlink12 und mlink13, komisch..,

Hier noch mal die seite zum anschauen..
http://www.freshandfunky.net/Untitled-1.html


Danke vielmals
Naci
HTML:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<link rel="stylesheet" type="text/css" href="fresh.css" />
</head>

<body>
<div id="mittel">
	      <div id="mlink"><div id="mlink1"></div><div id="mlink2"></div><div id="mlink3"></div>
	      <div id="mlink4"></div><div id="mlink5"></div><div id="mlink6"></div><div id="mlink7"></div><div id="mlink8"></div><div id="mlink9"></div><div id="mlink10"></div><div id="mlink11"></div><div id="mlink12"></div><div id="mlink13"></div></div>
	      <div id="mrechts"></div>
	    </div>
</body>

Code:
#mittel { margin-top: 0; padding-top: 0;}
#mlink {float:left; width: 133px; height: 201px; background-color: #f5f5f4; padding-left:7px;}
#mrechts { float:left; width: 725px; height: 201px; margin-right:4px;}
#mlink1 {background: url(images/fresh2bslice1_18.gif) no-repeat top right; width: 133px; height:6px;}
#mlink2 {
	width: 133px;
	height:15px;
	background: url(images/fresh2bslice1_26.gif) no-repeat top right;
	background-color: #a1a1a1;
}
#mlink3 { background-color: #606060; width: 133px; height:13px; margin-top: 5px;}
#mlink4 {
	background-color: #606060;
	width: 133px;
	height:13px;
	margin-top: 4px;
}
#mlink5 {
	background-color: #606060;
	width: 133px;
	height:13px;
	margin-top: 4px;
}
#mlink6 {
	background-color: #606060;
	width: 133px;
	height:13px;
	margin-top: 4px;
}
#mlink7 {
	background-color: #606060;
	width: 133px;
	height:13px;
	margin-top: 4px;
}
#mlink8 {
	background-color: #606060;
	width: 133px;
	height:13px;
	margin-top: 4px;
}
#mlink9 {
	background-color: #606060;
	width: 133px;
	height:13px;
	margin-top: 4px;
}
#mlink10 {
	background-color: #606060;
	width: 133px;
	height:13px;
	margin-top: 4px;
}
#mlink11 {
	background-color: #606060;
	width: 133px;
	height:13px;
	margin-top: 4px;
}
#mlink12 {
	background-color: #a1a1a1;
	width: 133px;
	height:15px;
	background-image:url(images/fresh2bslice1_57.gif);
	background-repeat:no-repeat;
	background-position:right;
	margin-top: 5px;
}
#mlink13 { background-color: #f5f5f4; width: 133px; height: 7px; background-image:url(images/fresh2bslice1_62.jpg); background-repeat:no-repeat; background-position:right; }
 

Anhänge

  • fresh2bslice1_18.gif
    fresh2bslice1_18.gif
    76 Bytes · Aufrufe: 54
  • fresh2bslice1_26.gif
    fresh2bslice1_26.gif
    194 Bytes · Aufrufe: 54
Zuletzt bearbeitet:
Die Angaben für background-position werden in umgekehrter Reihenfolge notiert. Der erste Wert steht für die horizontale, der Zweite für die vertikale Position.

CSS:
/* aus */
background-position: top right;

/* wird */
background-position: right top;

Für Elemente, deren Höhe weniger als 10 Pixel beträgt, 'benötigt' der IE entweder die gleichwertige, oder 'auf-null-gesetzte' Schriftgröße:

CSS:
#mlink1 {
height: 6px;
font-size: 6px;
}

#mlink13 {
height: 7px;
font-size: 7px;
}

/* oder */

#mlink1 {
height: 6px;
font-size: 0;
}

#mlink13 {
height: 7px;
font-size: 0;
}
 
Status
Nicht offen für weitere Antworten.
Zurück