CSS: table-cell

2 satır ve 3 sütun içeren bir tablo elde etmek için aşağıdakileri yapmanız gerekir:

.display-table {
    display: table; 
}
.display-table > div { 
    display: table-row; 
}
.display-table > div > div { 
    display: table-cell;
    padding: 5px;
}

Aşağıdaki örnekte de görebileceğiniz gibi, 3. sütundaki div öğelerinin içeriği yoktur, ancak ilk 2 sütundaki metin tarafından ayarlanan otomatik yüksekliğe adapte oluyor.

<div class="display-table">
    <div>
        <div>0, 0</div>
        <div>0, 1</div>
    </div>
    <div>
        <div>1, 0</div>
        <div>1, 1</div>
    </div>
</div>
css table cell
css table-cell

Önceki

ücretsiz wordpress woocommerce e-ticaret teması

Sonraki

online webfont dönüştürücü

Bir cevap yazın

Email adresiniz paylaşılmayacak. Gerekli alanlar * ile işaretlidir.

Email aboneliği

Esakademi.com'dan iyi ve güzel haberler almak için listeye mailinizi ekleyin