Layoutproblem mit css

Status
Nicht offen für weitere Antworten.
psifactory

psifactory

Erfahrenes Mitglied
Hallo,

und zwar habe ich folgendes Problem! Bei meinem Layout rutscht mir immer der Container "haupt_inhalt_kurz_rechts" runter. Und "haupt_inhalt_kurz_links" ist nicht im IE zentriert und im FF o.ä. linksbündig wie er es soll.

Hier mal den Code von allem. Und nicht von start_****** verwirren lassen. Die dienen zur Gestaltung der Eintrittsseite.

HTML
HTML: 
<body>
<div id="haupt_container">
<div id="haupt_header">
<div id="haupt_nav_oben_space"></div>
<div id="haupt_nav_unten">fffffff</div>
</div>
<div id="haupt_inhalt_kurz">
<div id="haupt_inhalt_kurz_links"><img src="images/hauptseite_impressum_links.jpg" alt="grafik impressum" width="194" height="656" /></div>
<div id="haupt_inhalt_kurz_rechts">
<div id="haupt_inhalt_kurz_textbereich"></div>
<div id="haupt_inhalt_kurz_footer"></div>
</div>
</div>
<div id="footer">Sitemap // Impressum //<strong> © SFK NETWORKSSERVICE GMBH</strong></div>
</div>
</body>


CSS
Code: 
body {
	background-color: #FFFFFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	color: #000099;
	text-align: justify;
	padding:50px;
	margin-left:50px;
	margin:0px;
	text-align: center;
}

#start_container {
	height: 860px;
	width: 920px;
}

#haupt_container {
	height: 860px;
	width: 920px;
}

#start_header {
	height: 198px;
	width: 920px;
}

#haupt_header {
	height: 198px;
	width: 920px;
	background-image:url(images/hauptseite_02.jpg);
	background-repeat:no-repeat;
}

#haupt_nav_oben_space {
	height: 168px;
	width: 920px;
}

#haupt_nav_unten {
	height: 30px;
	width: 920px;
}

#start_inhalt {
	height: 609px;
	width: 920px;
}

#haupt_inhalt_kurz {
	height: 656px;
	width: 920px;
	clear: center;
	float: left;
}

#haupt_inhalt_kurz_links {
	height: 656px;
	width: 194px;
	margin: 0 0 0 0;
	}
	
#haupt_inhalt_kurz_rechts {
	height: 656px;
	width: 726px;
	margin: 0 0 0 194px;
}

#haupt_inhalt_kurz_textbereich {
	height: 598px;
	width: 726px;
	background-image:url(images/hauptseite_06.jpg);
	background-repeat:repeat;
	}
	
#haupt_inhalt_kurz_footer {
	height: 58px;
	width: 726px;
	background-image:url(images/hauptseite_08.jpg);
	background-repeat:no-repeat;
	}

#footer {
	height: 15px;
	width: 920px;
	text-align: right;
}

Für eure Hilfe wär ich sehr dankbar. Sollte eigentlich heute schon fertig sein das ganze :rolleyes:
 
Hi,

versuch es mal hiermit:

Code: 
#haupt_inhalt_kurz {
        height: 656px;
        width: 920px;
}

#haupt_inhalt_kurz_links {
        height: 656px;
        width: 194px;
        margin-right:0 !important;
        margin-right:-3px;
        float: left;
        }

#haupt_inhalt_kurz_rechts {
        height: 656px;
        width: 726px;
        margin: 0 0 0 194px !important;
        margin: 0 0 0 0;
}
Denn wie soll #haupt_inhalt_kurz rechts umflossen werden, wenn es die Gesamtbreite des Layouts besitzt?

Zudem gibt es keinen Wert center für die clear-Eigenschaft, sondern:

  • left
  • right
  • none
  • inherit
 
Hi,

die !important-Regel gilt allen modernen Browsern und sorgt dafür, dass sie die nachfolgende gleichlautende CSS-Eigenschaft ignorieren, die dem IE gewidmet ist.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück