nicht angemeldet
Probleme mit Blöcken unter Firefox
Hallo zusammen
Ich habe ein Problem mit Blöcken im Firefox.
Beim Folgenden code werden die Blöcke main und right unter Firefox ausserhalb des Blockes container angezeigt. Dies sieht man anhand des schwarzen durchgezogenen Rahmen.
Hat jemand eine Tipp an was es liegt? Auch wenn es mir schwer fällt zu sagen, dass es im IE so aussieht wie ich es gerne hätte.
css:
body {
padding-top:20px;
}
#container {
width: 752px;
border: 1px solid #222222;
}
#header {
width: 100%;
background-color:blue;
}
#main {
width: 550px;
float: left;
border: 1px dotted gray;
}
#right {
width: 200px;
float: right;
background-color: yellow;
}
html
<html>
<head>
<link rel="STYLESHEET" type="text/css" href="tmp.css">
</head>
<body text="#222222" link="#222222" vlink="#222222" alink="#222222" style="margin:0px 0px 0px 0px;">
<div align="center" style="margin:0;padding:0;">
<div id="container">
<div id="header">
Head
</div>
<div id="main">
main
</div>
<div id="right">
rechts
</div>
</div>
</div>
</body>
</html>
Vielen Dank für die Hilfe.
gruäss Stefan
-
Hallo
Versuchs doch mal damit, evtl. ist das ein Ansatz. (position: absolute;)
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">
<!--
#Layer1 {
background-color: #000000;
}
#Layer3 {
background-color: #FF0000;
}
#Layer4 {
background-color: green;
}-->
</style>
</head><body>
<div id="Layer1" style="position:absolute; width:526px; height:115px; z-index:1">header
<div id="Layer3" style="position:absolute; width:331px; height:57px; z-index:1; top: 58px; left: 0px;">main</div>
<div id="Layer4" style="position:absolute; width:196px; height:57px; z-index:2; left: 330px; top: 58px;">right</div>
</div></body>
</html>-
ich möchte eigentlich ohne Ebenen arbeiten.
Ich habe das Problem nun noch online gestellt.
http://www.webengine.ch/temp/tmp.html-
Hi,
ich möchte eigentlich ohne Ebenen arbeiten.
sehr vernünftig.
Was Dir fehlt, ist ein Block-Element, daß über clear den Elementenfluß wiederherstellt.freundliche Grüße
Ingo-
wo müsste dieses Block-Element mit clear stehen?
ich habe es mit folgendem ausprobiert aber ohne erfolg.... <div style="clear:both;"> <div id="main">main</div> <div id="right">rechts</div> </div>Wenn ich dem css Element container eine höhe gebe nimmt er sie normal an, aber das Problem ist ja, dass man die Höhe eines Html Dokumentes eigntlich nie kennt.
-
Hi,
wo müsste dieses Block-Element mit clear stehen?
natürlich innerhalb des Elements, dessen Dimensionen durch die floatenden Elemente sonst nicht beeinflußt werden - und natürlich nach diesen notiert.
freundliche Grüße
Ingo
-
-
ich habe es nun hingekriegt. Nach dem right block braucht es anscheinend noch einen weiteren Block (welcher immer noch container liegt), welcher die Eigenschaft clear:both besitzt.
Vielen Dank für die Hilfe.
-
-
-
-
Hallo Stefan.
<html>
<head>
<link rel="STYLESHEET" type="text/css" href="tmp.css">
</head>
<body text="#222222" link="#222222" vlink="#222222" alink="#222222" style="margin:0px 0px 0px 0px;">
<div align="center" style="margin:0;padding:0;">
<div id="container">
<div id="header">
Head
</div>
<div id="main">
main
</div>
<div id="right">
rechts
</div>
</div>
</div>
</body>
</html>Das sieht stark nach [Divitis](http://www.bs-markup.de/blog/archiv/2005/06/30/dr-css/) aus... Einen schönen Montag noch. Gruß, Ash\*feel free\*ura -- Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:) fl:( ss:) ls:[ js:| [30 Days to becoming an Opera8 Lover](http://operalover.tntluoma.com/8/) -- [Reviewing Macworld's Reviews of MacOpera](http://operalover.tntluoma.com/8/reviewing_macworlds_reviews_of_macopera) Meine Browser: [Opera 8.50](http://opera.com/download/) | [Firefox 1.0.7](http://www.mozilla.org/products/firefox/all) | [Lynx 2.8.5](http://lynx.isc.org/current/) | Konqueror 3.3.2 | Netscape 4.7 | IE 6.0 