DIV CSS Layout - feste Position expand Elternteil

Question

Ich schaue mir ein 'Drag and Drop'-Skript an, das für meine Bedürfnisse funktioniert, aber ich habe ein paar Probleme mit der DIV-Positionierung und bekomme ein DIV, das behoben werden soll erweitern Sie seine Eltern.

Ich habe ein CodePen Beispiel erstellt.

Grundsätzlich habe ich eine list auf der der Seite, die wachsen oder schrumpfen kann. Dieses div wird korrekt erweitert und kontrahiert.

Eine der rechten Seite der Seite Ich habe eine dropzone die Benutzer können aus der Liste ziehen und füllen Sie die Drop-Zone.

Wenn die Liste länger als die Seite ist, wenn der Benutzer nach unten scrollt, habe ich den rechten Fensterbereich (in GELB), um mit der Seite nach unten zu blättern. Wenn der Benutzer hochscrollt, möchte ich, dass der GELBE Bereich nach oben scrollt und schließlich am ursprünglichen Ort ankommt.

Wenn Elemente von links nach rechts gezogen werden, wird das Feld GELB erweitert. Aber es dehnt sich über den DRAG DIV aus, es sollte den Drag Div erweitern, so dass der GELBE Bereich in ihm bleibt.

Bitte einige beraten, wie ich das zum Funktionieren bringen. Thanks :)

Answer 1

hinzufügen padding zu diesem

#right_container { 
padding: 20px; 
} 

Position löschen

#right { 
position :absolute; 
} 

, was ich heute falsch interpretiert bin ..