HTML, taşma: kaydırma ve float

Sırası olmayan birçok listeyi (ul) içine alan bir div var. Her bir "float: left" için ayarlıyım. Ayrıca, onları "overflow-x: scroll" olarak ayarlayan üst div'a sahibim. Neler yapılıyorsa, sayfanın kenarına geldiklerinde ve üst div (kaydırma çubukları) kaydırma özelliğinden yararlanmak için yan yana kalmamaları durumunda, sarmalar sarılıyor. Niye ya? Bunu nasıl düzeltebilirim?HTML, taşma: kaydırma ve float

Yardımlarınız için teşekkür ederiz. Eğer UL'lerini süzülüyor Çünkü

kaynak

2011-05-08 s2cuts

Eğer uls toplam genişliği * [uls sayısını]
http://jsfiddle.net/seler/gAGKh/ width = [ul genişliğini] vermek ya sayarız hangi başka div bu ULS eklemek gerekir http://jsfiddle.net/seler/gAGKh/1/

kaynak

2011-05-08 07:57:35 seler

Bir iç div oluşturmak çok yardımcı olur. Uygun genişlik hesaplamak için JS kullanmak yerine, yeni iç divun statik genişliğini, en aşırı durumun hesaba katılması için yeterince geniş bir genişliğe ayarlamanın yerleşime zarar vermeyeceğini buldum. Teşekkürler seler. – s2cuts

@ S2cuts sadece sabit ul genişliğinde ve sabit ul numaranız varsa çalışabilir. – seler

Kötü javascript düzeltme, ddlshack tarafından açıklanan cevap daha temiz bir çözümdür. – user1226868

, onlar üst div genişletmek olmayacak şekilde artık akış belgede bulunmayan (dolayısıyla sarma.)

verir üst div üzerinde açık bir genişlik ayarlamayı deneyin hepsi için yan yana var olmak. Ayrıca, üst div içindeki UL'leri temizlemezseniz, büyük olasılıkla, dikey olanlarda da sorunlara yol açmayacaksınız demektir. Emin temizledikten yüzen olun :)

kaynak

2011-05-08 07:09:11 Tim

açıklama benim sorgunun parçası oldu, teşekkür ederim. "Şamandıralarınızı temizlediğinizden emin olun" ile ne demek istediğini açıklayabilir misiniz? – s2cuts

@ s2cuts Ana kaplarınızı içeriğin yüksekliğine genişletmek için [clearfix] (http://www.webtoolkit.info/css-clearfix.html) gibi bir şey kullandığınızdan emin olun. Aksi takdirde, yatay genişlikte yaşadığınız sorunlara benzer dikey yükseklikteki sorunlara yönelirsiniz. Sadece bir kafa. – Tim

Sen gerekir:

<li> da yüzer olun.
Her genişliğe <ul> olarak ayarlayın.
Sabit genişliği, tüm listeleri saklayacak kadar içeren şekilde ayarlayın. Örneğin

ul { width: 250px; } 
li { margin-left: 5px; } 
ul, li { float: left; } 
div { overflow-x: scroll; width: 750px; }

Test case.

kaynak

2011-05-08 07:18:04

Sen liste öğelerinizi görüntülenecek şekilde ayarlayabilirsiniz: satır içi blok, sonra beyaz boşluk kullanın: nowrap. Çoğu modern tarayıcıda çalışır.

http://jsfiddle.net/gAGKh/22/

kaynak

2012-04-21 17:02:00 ddlshack

cevap

İlgili konular