CSS: Wie man einen div-block *nicht* nehmen Sie Platz im übergeordneten container

Wenn ich 2 div-tags:

<div id="parentDiv">
   <div id="childDiv"><!-- other html --></div>
   <!-- parent div html -->
</div>

Möchte ich den Inhalt <div id="childDiv"> sich den Inhalt <!-- parent div html -->.

Grund (für den Fall, das sieht aus wie schlechtes code-design für jedermann):
Ich brauche einen hack Abhilfe in google sites kann ich nicht hinzufügen benutzerdefinierter code auf dem sidebar-nav, nur in den Haupt-html-Raum, ich möchte ein div float, nimmt kein Platz und relativ positionieren Sie es über die Seite bar, um die erzwungene Einschränkung.

Kann ich alles machen außer halt die childDiv von Speicherplatz im bastardized main-page-container.

könntest du post von der css, mit dem Sie arbeiten, vielleicht ein jsfiddle?

InformationsquelleAutor David Parks | 2012-03-28

  1. 13

    Können Sie ihm eine position absolute, und navigieren Sie mit den Margen.

     
#childDiv { 
position: absolute; 
margin-top: -100px; 
margin-left: -100px; 
}
    Das würde ich auch versuchen
    gut, DANKE!
    Sie müssen auch position: relative den Eltern

    InformationsquelleAutor S.Visser

  2. 5

    Wie wäre es mit einem einfachen

    #childDiv {height:0; overflow:visible;}

    Aber Sie wahrscheinlich wollen, dass es einen hintergrund, der Farbe, hm? Hm.

    geniale Idee! Dank

    InformationsquelleAutor Mr Lister

  3. 3

    Nehmen Sie den childblock aus der Strömung. Der beste Weg, dies zu tun ist position: absolute auf das Kind div und position: relative auf der übergeordneten div.

    position: relative der Eltern ist der Schlüssel. Sonst wird das Kind "snap" zu einem übergeordneten position. Danke!

    InformationsquelleAutor Frank van Wijk

  4. 3
    #parentDiv {
    position: relative;
}
#childDiv {
    position:absolute;
    top:0;
    left:0;
    width:100%;
}

    Wenn Sie benötigen zu stoßen, die Inhalte um, oder überlappen Sachen, die 'außerhalb' der Seitenleiste, können Sie die Verwendung von negativen Margen zu erhöhen, die Breite der childDiv oder oben verschieben (zur Abdeckung Polsterung oder die Seitenränder können Sie nicht überschreiben).

    Wenn Sie brauchen, um die #childDiv decken das gesamte #parentDiv, können Sie mit ein wenig JavaScript um einen min-height auf childDiv, dann fügen Sie einen farbigen hintergrund oder etwas zu decken Inhalten.

    var parentHeight = jQuery('#parentDiv').height();
jQuery('#childDiv').css('min-height',parentHeight + 'px');

    InformationsquelleAutor Matthew Darnell

Schreibe einen Kommentar