Erweitern Sie Kind div über Container div

Question

Ich versuche, dieses div quer mit der Breite des Browsers zu erweitern. Ich habe von here gelesen, dass Sie {position:absolute; left: 0; right:0;}, dass, wie in der jsfiddle hier erreichen können: http://jsfiddle.net/bJbgJ/3/

Aber das Problem ist, dass meine aktuellen #container eine {position:relative;} Eigenschaft hat, und daher, wenn ich mich bewerben {position:absolute} für das Kind div, würde es sich nur auf #container beziehen. Gibt es eine Möglichkeit, meinen Tauchgang über die #container hinaus noch zu verlängern?

Answer 1

Ich kann mich fünf Möglichkeiten, um potenziell Ihr Ziel zu erreichen:

1. Verwenden negative Margen auf dem inneren Elemente es außerhalb der Mutter zu bewegen

2. Verwenden Sie Javascript um das innere Element außerhalb zu bewegen des Elternteils.

3. Ändern Sie den Quellcode, und verschieben Sie das innere Element außerhalb des übergeordneten Elements.

4. Verwenden Sie position: fixed auf dem inneren Element. Dies ermöglicht das Ausbrechen des inneren Elements, hat aber die untere Seite, dass das Element an der gegebenen Position fixiert wird (niemals bewegt).

5. die position: relative; vom Eltern-Elemente entfernen oder dem übergeordneten Elemente können Sie versuchen, ein position: static

Answer 2

gibt overflow:visible an die Mutter Hinzufügen div, dann das Kind zu machen breiter als die Eltern.