Positionierung von DIV´s in FF und IE

Status
Nicht offen für weitere Antworten.

MSinistar

Grünschnabel
Hallo zusammen,

bin gerade dabei ein Grundgerüst für eine Website zu gestalten. Will die komplette Seite mit DIV-Containern einteilen.
Ich hab einen HEADER-, CORNER-, SIDEBAR- und CONTENT-Container.

Nun wird mir der CONTENT-Container im FF mit einem Abstand zum HEADER angezeigt und im IE nicht, sobald ich z.B. ein <p>-Element einfüge.

Könnt ihr mir sagen, auf was ich hier achten muss, damit ich KEINEN Abstand bekommen?

Hier mal der HTML-Code:

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Test</title>
    <link type="text/css" rel="stylesheet" href="test.css" />
    <!--<link type="text/css" rel="stylesheet" href="css/sidebar.css" />
    <link type="text/css" rel="stylesheet" href="css/navigation.css" /> -->
  </head>
  <body>
		<div id="corner-container">
	    <p>
	      Das ist der CORNER-CONTAINER.
	    </p>
		</div>

  	<!-- HEADER -->
		<div id="header-container">
	    <p>
	      Das ist der HEADER-CONTAINER.
	    </p>
		</div>

		<!-- SIDEBAR -->
		<div id="sidebar-container">
		<p>
			Das ist der SIDEBAR-CONTAINER.
		</p>
		</div>

		<!-- CONTENT -->
		<div id="content-container">
			<div id="content">
				<p>
	        Das ist der CONTENT-CONTAINER.
				</p>
			</div>
		</div>

  </body>
</html>

und der CSS-Code:
Code:
body {
	width:				1000px;
	margin-left:	auto;
	margin-right:	auto;
	background-color: #000000;
}

#header-container {
	height:				130px;
	background-color:	blue;
}

#corner-container {
	float:				left;
	height:				130px;
	width:				180px;
	background-color: white;
}

#sidebar-container {
	float:				left;
	width:				180px;
	height:				600px;
	background-color: red;
}

#content-container {
	background-color: gray;#
	height:				600px;
}

#content {
  margin:		0px;
}

Vielen Dank schonmal im Voraus

Liebe Grüße, msinistar
 
Hi,
Nun wird mir der CONTENT-Container im FF mit einem Abstand zum HEADER angezeigt und im IE nicht, sobald ich z.B. ein <p>-Element einfüge.

Könnt ihr mir sagen, auf was ich hier achten muss, damit ich KEINEN Abstand bekommen?
hierfür muss die äußere Polsterungseigenschaft des p-Elements zurückgesetzt werden:

Code:
p {
margin:0;
}
Gleiches gilt für die Überschriften h1 - h6.
 
Status
Nicht offen für weitere Antworten.
Zurück