Verschiedene Anzeigearten bei Browsern.

Status
Nicht offen für weitere Antworten.

Devil86Hh

Grünschnabel
Moin Community bin selber ein CSS Anfänger und würde mich sehr über eure Hilfe freuen.
Ich habe Folgendes Problem ich habe 2 divs und möchte das eine div in das andere packen. Die divs haben eine feste Breite. Mein Problem ist nun das sie verschieden im IE und im Firefox angezeigt werden. Ich benutze eine externe CSS Datei die ich in die Html datei einbinde.
Meine CSS Datei sieht wie folgt aus:
Code:
#box {
width:760px;
height:600
margin:0px auto;
margin: 10px;
text-align:left;
border:1px solid #797979;
}

#box2 {
width:750px;
height:580px
margin:0px auto;
margin: 10px;
text-align:left;
border:1px solid #797979;
}

Und meine Html Datei sieht wie folgt aus:
Code:
<html>
<head>
<link rel="stylesheet" title="Standard" media="screen, projection" href="screen.css" type="text/css" />
</head>
<body>
<center>
		<div id="box">
		<div id="box2">
Seiteninhalt...

</div>
</div>
</center>
</body>
</html>
Habe von diesem IE Box Model Bug gehört und habe auch schon zich Seiten bei Google durchgelesen aber irgendwie steige ich da nicht so recht durch. Es wäre nett wenn einer von euch es mir Erklären würde und mir bei meinem Problem weiterhelfen könnte.
 
Hallo!
Da fehlt noch was ;)
Code:
#box {
width:760px;
height:600;
margin:0px auto;
margin: 10px;
text-align:left;
border:1px solid #797979;
}

#box2 {
width:750px;
height:580px;
margin:0px auto;
margin: 10px;
text-align:left;
border:1px solid #797979;
}

Als zweites verstehe ich nicht warum Du die box2 nur 10px kleiner machst und ihr dann einen Aussenabstand von 10 px gibst.

Gruß
Axel
 
Dein HTML-Dokument besitzt derzeit keine Doctype-Deklaration, womit der IE (6.0) im Quirksmodus läuft und das Boxmodell falsch interpretiert.

Wenn die innere Box umlaufend einen Außenabstand von 10 Pixel zum Parent-DIV besitzen soll, dann muß die Breite 740px betragen (760px - 2*10px).

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>

<style type="text/css">
<!--
#box {
width: 760px;
height: 600px;
margin: 0px auto;
text-align:left;
border: 1px solid #797979;
}

#box2 {
width: 740px;
height: 580px;
margin: 10px;
text-align: left;
border: 1px solid #797979;
}
-->
</style>

</head>
<body>

<div id="box">
              <div id="box2">Seiteninhalt...</div>
</div>

</body>
</html>
 
Wir schliessen die Threads hier nicht wenn ein Thema erledigt ist.
Du hast aber unten rechts die Moeglichkeit den Thread als erledigt zu markieren.
 
Status
Nicht offen für weitere Antworten.
Zurück