Rumah > hujung hadapan web > tutorial css > Mengapa Div Terapung Bertindan Menegak Walaupun dengan Overflow:hidden?

Mengapa Div Terapung Bertindan Menegak Walaupun dengan Overflow:hidden?

DDD
Lepaskan: 2024-11-13 14:43:02
asal
465 orang telah melayarinya

Why Do Floated Divs Stack Vertically Even with Overflow:hidden?

Penjajaran Mendatar Div Terapung

Dalam kes apabila div diapungkan dibiarkan dalam bekas dengan limpahan: tersembunyi, ia mungkin disusun secara menegak walaupun apabila terdapat ruang yang mencukupi secara mendatar. Untuk memastikan ia sejajar dengan betul, pertimbangkan penyelesaian berikut:

Penyelesaian:

Buat div dalam dalam bekas yang mempunyai lebar yang lebih luas, mencukupi untuk menampung semua terapung div.

#container {
  width: 200px;
  overflow: hidden;
}

#inner {
  width: 2000px;
  overflow: hidden;
}

.child {
  float: left;
  width: 50px;
  height: 50px;
}
Salin selepas log masuk
<div>
Salin selepas log masuk

Dengan menyediakan lebar yang mencukupi dalam div dalam, div terapung akan dijajarkan secara mendatar dalam bekas, seperti yang dimaksudkan.

Atas ialah kandungan terperinci Mengapa Div Terapung Bertindan Menegak Walaupun dengan Overflow:hidden?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan