Überlauf-artiges Scrollen führt dazu, dass der Inhalt abgeschnitten wird ⇐ CSS

[Guest]

Ich habe derzeit einen Container mit einer maximalen Höhe von 800 Pixeln. Es hat auch overflow-y:scroll. Was ich zu erreichen versuche, ist einfach (wahrscheinlich nicht so einfach, deshalb frage ich euch!).

Ich möchte weiterhin diese überfüllte Schriftrolle haben . Allerdings habe ich Inhalte, die abgeschnitten werden. Ich habe ein Div mit der Klasse Future-Dropdown, dessen Inhalt diesen Container absichtlich überlagern soll. Wenn Sie sich das Code-Snippet ansehen, wird mein Inhalt im Div aufgrund des überlaufartigen Scrollens wie vorgesehen abgeschnitten.

Wie kann ich das umgehen und es trotzdem haben? Ich brauche immer noch diesen scrollbaren Container, aber ich brauche auch eine Möglichkeit, meinen Inhalt weiterhin an dieser Position anzuzeigen.

Vorschläge bitte!

Code: Select all

    * {
padding: 0;
margin: 0;
}

.scroll-list {
max-height: 800px;
overflow-y: scroll;
border-radius: 5px;
border: 5px solid blue;
width: 400px;
}

li {
height: 200px;
width: 100%;
border-radius: 2px;
background-color: white;
font-size: 15px;
text-align: center;
list-style-type: none;
background: lightgray;
/* margin: 0 auto; */
}

.future-dropdown {
position: relative;
left: 200px;
}

Code: Select all

  



  






[*]




[list]
Content Future dropdown
[*]Content
[*]Content
[*]Content
[*]Content
[*]Content
[*]Content
[*]Content
[*]Content
[*]Content
[/list]