Dalam kode saya di bawah ini, ketika baris kedua terputus, ia memindahkan elemen di bawah (ul) ke bawah. Tapi saya ingin memindahkan elemen di atas sebagai gantinya. Sehingga yang di bawah ini tetap di tempatnya, tetapi saya tidak dapat menemukan cara yang tepat untuk menyelesaikannya.

li {
  display: inline-block;
  font-size: 12px;
}

.container {
  position: relative;
  top: 190px;
  left: 4px;
}
<div class="container">
  <p class="pseudo1">First Line should move up</p>
  <p class="pseudo2">This line shouldn't move the element below it further down when the line breaks</p>
  <ul>
    <li>Lorem Ipsum</li>
    <li>Stay here</li>
    <li>!</li>
  </ul>
</div>
0
Jojo 22 Oktober 2019, 13:51

1 menjawab

Jawaban Terbaik

Saya harap ini akan membantu untuk skenario Anda. Cukup tambahkan kelas berikut.

li {
  display: inline-block;
  font-size: 12px;
}

.container {
  position: relative;
  top: 190px;
  left: 4px;
}

.pseudo2{
    position: sticky;
    height: 20px;
}
<div class="container">
  <p class="pseudo1">First Line should move up</p>
  <p class="pseudo2">This line shouldn't move the element below it further down when the line breaks</p>
  <ul>
    <li>Lorem Ipsum</li>
    <li>Stay here</li>
    <li>!</li>
  </ul>
</div>
0
Moorthy GK 22 Oktober 2019, 11:11