DIV überschneiden sich @ tutorials.de: Tutorials, Forum & Hilfe

polarpro · 15.09.11 12:45

Servus,
ich stolpere über folgende Sache:

Wie zu sehen ist (s. Datei im Anhang), ist in meinem Layout rechts oben ein fester Bereich, der umflossen wird von anderen Div-Blöcken. Das Problem ist, dass zwar der Text umfließt, jedoch nicht die grünen oberen und unteren Div-borders.
Kann mir jemand sagen, was ich falsch gemacht habe?
Danke

Hier noch der Code:

HTML-Code:

<html>
<head>
<title>Div-Problem</title>
<style type="text/css">

  div#Cover {
    float: right;
    width: 250px;
    height: 350px;
    margin: 10px;
    padding: 10px;
    border: 3px solid orange;
  }

  div#Inhalt {
  	border-bottom: 1px solid blue;
  	border-top: 1px solid blue;
  	padding: 5px;
  }

</style>
</head>

<body>

<div id="Cover"></div>

<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext </div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext</div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext </div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext</div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext </div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext</div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext </div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext  Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext</div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext</div>
<div id="Inhalt">Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext Blindtext</div>

</body>
</html>

***hela*** · 15.09.11 15:17

Zitat von polarpro

...
Kann mir jemand sagen, was ich falsch gemacht habe?

Hallo,

du hast nichts falsch gemacht, das ist völlig normales Verhalten, dass die Blockelemente so breit bleiben. Normalerweise hat das kaum Konsequenzen, da das gefloatete Element selten transparent (wie in deinem Beispiel) ist.

edit:
Übrigens sehe ich gerade, dass in deinem Beispieldokument das ID-Attribut "Inhalt" mehrmals vorkommt. Das ist kein valides HTML.

polarpro · 15.09.11 15:49

Zitat von hela

du hast nichts falsch gemacht, das ist völlig normales Verhalten, dass die Blockelemente so breit bleiben. Normalerweise hat das kaum Konsequenzen, da das gefloatete Element selten transparent (wie in deinem Beispiel) ist.

Danke. Ich denke, dann muss ich mit margin-right o.dgl. mal ausführlich rumprobieren. Der gewünschte Effekt ist der, dass sich diverse Blockelement nacheinander um den orangefarbenen Kasten schmiegen.

Zitat von hela

Übrigens sehe ich gerade, dass in deinem Beispieldokument das ID-Attribut "Inhalt" mehrmals vorkommt. Das ist kein valides HTML.

Hoppla, stimmt, das ist mir im Eifer des Gefechtes passiert. Danke für den Hinweis.

tut orials.de	tut verbinden	tut dir helfen	tut kooperieren
©2000-2012 tutorials.de Alle Rechte vorbehalten	tut informieren » Impressum » Nutzungsregeln » Netiquette » Team » Redaktion	» Tutorials » Videotutorials » Showroom » Events & Contests » Chat » RSS-Feed » Blogs	» der-webdesigner.net » DesignerInAction » Design Nation » Directorforum » Flashhilfe » PHP-Resource » PHPwelt » PSD-Tutorials

Themen-Optionen

Anzeige

Ähnliche Themen

CSS Position fixed - Soll Content nicht überschneiden.

Farbänderung einer Form beim überschneiden einer anderen

2 Audioclips überschneiden

Objekte überschneiden sich

Vektoren überschneiden sich. Lösung mit Illustrator?

E-Mail:

Abonnieren Abbestellen