Div wird nicht angezeigt

Status
Nicht offen für weitere Antworten.

alex130

Erfahrenes Mitglied
Hi
ich hab wieder mal ein Problem :D
Und zwar wird der Div .box1 nicht angezeigt, ich hoffe ihr könnt mir helfen.
Danke

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">

#container {
width: 800px;
margin: 0 auto;
background-color:#FFFFFF;
}

#header {
background-color: #f12375;
background-image: url(images/logo.jpg);
width: 800px;
height: 140px;
border: ;1px solid #faabec;
margin-bottom: 8px;
}

#topNavi {
background-color: #949599;
width: 800px;
height: 30px;
margin-bottom: 8px;
}

.leftCol { /* linke Spalte */
width: 150px;
float: left;
height: auto !important;
height: 1%;
}

.centerCol {
width: 480px;
margin: 0px 10px 0px 10px;
}


.rightCol { /* rechte Spalte */
width: 150px;
float: right;
height: auto !important;
height: 1%;
}

.box1 {
width: 140px;
background-color: #FFFFFF;
margin: 4px;
}

box1_head {
width: 140px;
background-color: #f12375;
height: 30px;
}

box1_content {
width: 140px;
min-height: 40px;
background-color: #949599;
}

</style>
</head>

<body>

<div id="container">
	<div id="header"></div>
	<div id="topNavi"></div>
	<div class="leftCol">
	
	<div class="box1">
		<div class="box1_head">test</div>
		<div class="box1_content">test</div>
	</div>
	
	</div>
	<div class="centerCol">
	
	</div>
	<div class="rightCol">
	
	</div>
</div>

</body>
</html>
 
box1_head {
width: 140px;
background-color: #f12375;
height: 30px;
}

box1_content {
width: 140px;
min-height: 40px;
background-color: #949599;


Bitte mit Punkt vorne ;)
ps: ev. weil er #FFFFFF ist? gleich wie der Container? weiss nicht, hab nur schnell draufgesehen ...
 
Was heißt denn die Box wird nicht angezeigt? Was erwartest du denn zu sehen? Der Hintergrund ist weiß. Und weiß auf weiß sieht man schlecht. Oder hab ich was falsch verstanden?

#Edit

Ah, ich verstehe du meinst den Head + Content Bereich! ;)
 
Im IE und FF oder wo? Geht's mit einem Browser? mach doch mal n text-align: center rein, könnte helfen... hab aber nicht den ganzen Code gelesen...
 
Hi
Ich habs jetzt so gemacht:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">

#container {
width: 800px;
margin: 0 auto;
background-color:#FFFFFF;
}

#header {
background-color: #f12375;
background-image: url(images/logo.jpg);
width: 800px;
height: 140px;
border: ;1px solid #faabec;
margin-bottom: 3px;
}

#topNavi {
background-color: #949599;
width: 800px;
height: 30px;
margin-bottom: 8px;
}

.leftCol { /* linke Spalte */
width: 150px;
float: left;
height: auto !important;
height: 1%;
}

.centerCol {
width: 400px;
margin: 0 auto;
}


.rightCol { /* rechte Spalte */
width: 150px;
float: right;
height: auto !important;
height: 1%;
}

.box1 {
width: 150px;
background-color: #FFFFFF;
margin: 0px 0px 8px 0px;
}

.box1_head {
width: 150px;
background-color: #f12375;
height: 30px;
margin-bottom: 3px;
}

.box1_content {
width: 150px;
min-height: 40px;
background-color: #949599;
}

.content {
border: #e5e5e5;
width: 400px;
margin: 0 auto;
}

.content_head {
background-color: #f12375;
height: 30px;
}

.content_content {
min-height: 50px;
}

</style>
</head>

<body>

<div id="container">
	<div id="header"></div>
	<div id="topNavi"></div>
	<div class="leftCol">
	
	<div class="box1">
		<div class="box1_head">test</div>
		<div class="box1_content"><br /><br /><br /><br /><br /></div>
	</div>
	
	<div class="box1">
		<div class="box1_head">test</div>
		<div class="box1_content"><br /><br /><br /><br /><br /></div>
	</div>
	
	<div class="box1">
		<div class="box1_head">test</div>
		<div class="box1_content"><br /><br /><br /><br /><br /></div>
	</div>
	
	</div>
	
	<div class="centerCol">
		<div class="content">
			<div class="content_head"></div>
			<div class="content_content"></div>
		</div>
	</div>
	
	<div class="rightCol">
	
	
	<div class="box1">
		<div class="box1_head">test</div>
		<div class="box1_content"><br /><br /><br /><br /><br /></div>
	</div>
	
	<div class="box1">
		<div class="box1_head">test</div>
		<div class="box1_content"><br /><br /><br /><br /><br /></div>
	</div>
	
	<div class="box1">
		<div class="box1_head">test</div>
		<div class="box1_content"><br /><br /><br /><br /><br /></div>
	</div>

	</div>
</div>

</body>
</html>
Aber die rechten Boxen sind jetzt ein stück runter gerückt.
lg
 
könntest du nicht nur die änderung posten und den rest mal weglassen, wäre ein wenig überblickbarer...

hast du irgendwo mehr breite angegeben "als platz hat"?
 
Status
Nicht offen für weitere Antworten.
Zurück