css-hücre eşit genişlikte
Tablo bir kabın içinde tablo hücre elemanları belirsiz bir dizi var.
<div style="display:table;">
<div style="display:table-cell;"></div>
<div style="display:table-cell;"></div>
</div>
Saf CSS bir şekilde tablo-hücreleri farklı içerik boyutlu içlerinde varsa bile eşit genişlikte olmak için?
Teşekkürler.
Edit: max-genişlik Olması bilerek kaç bence hücreleri var? gerektirecektir
CEVAP
Burada hücre belirsiz sayıda çalışan keman: http://jsfiddle.net/r9yrM/1/
Her ebeveyn div
(. genişliği çözebilirsiniz ^em>tablo), aksi halde her zamanki gibi. 100% olacak
Hile kullanmaktırtable-layout: fixed;
ve bazı her hücre tetiklemek için, 2% burada genişliği. Bu tetikleyici olacaktırdiğertablo algorightm, tarayıcılar boyutlarını gösterilen saygı için çok zor deneyin.
Chrome ile test (ve gerekirse IE8 -) lütfen. Son bir Safari ile sorun değil ama onlarla bu hile uyumluluk hatırlamıyorum.
(İlgili talimatları) CSS:
div {
display: table;
width: 250px;
table-layout: fixed;
}
div > div {
display: table-cell;
width: 2%; /* or 100% according to OP comment. See edit about Safari 6 below */
}
DÜZENLE (2013): X, table-layout: fixed;
var OS Safari 6 Sakınınyanlış(ya da belki de sadece farklı, diğer tarayıcılardan. çok farklı Prova-okuma CSS2 bilmiyordum.1 REC masa düzeni ;) ). Farklı sonuçlar için hazır olun.
HTML - en İyi eşit genişlikte yapmak i...
Nasıl giriş ve seçmek alanları eşit ge...
Son bulma konusunda hata VBA hücre...
Nasıl iki dizide JavaScript ile eşit o...
Tablo hücre zorlamak için nasıl <td...