Frage stellen
habe hier ein recht seltsames border Problem. Es handelt sich hierbei (siehe unten) um ein container div, welcher ein float div (linkes Menu) und ein statisches content div (textinhalt) beinhaltet.
Sollte nun ein Rahmen bei content-wrapper div gesetzt sein z.b. border: 1px solid black; so erhaelt das float div den korrekten abstand (margin) von der oberen kante des umschliessenden div Blocks (content-wrapper).
Wenn aber kein Rahmen gesetzt wurde, so richtet sich das float Element an der oberen Kante des statischen content div aus.
Und hier liegt das Problem. Der Abstand des float Elementes muss/sollte sich unabhaengig vom content Element, also eigentlich an dem aussenliegenden Element, orientieren.
Dieses Problem tritt bei allen Gecko Browsern auf (FF etc.).
IE7 macht ausnahmsweise alles richtig.
Für Anregungen und/oder Hilfe wäre ich sehr dankbar.
Gruß
ramses2000
Hier noch der HTML/CSS Code:
Es tut mir leid, irgenwie wurden die id attribute immer rausgeschmissen.
- Code: Alles auswählen
<style>
#content-wrapper
{
border: 1px #FF00FF dotted ; /* rosa */
/* wenn border gesetzt => korrekter top-abstand des #content-nav
wenn border nicht vorhanden => falscher top-abstand des #content-nav
*/
}
#content-nav
{
border: 2px #FF0000 dotted; /* rot */
width: 200px;
float: left;
margin-top: 100px;
}
#content-box
{
border: 2px #0000FF dotted; /* blau */
margin-left: 220px;
margin-right: 220px;
margin-bottom: 10em;
margin-top: 65px;
}
</style>
</head>
<body>
<div>content-wrapper div
<div>content-nav div
..... Lorem ipsum dolor sit amet, consetetur sadipscing elitr..</div>
<div>content-box div
Lorem ipsum dolor sit amet...
</div>
</div>
</body>