SORU
8 HAZİRAN 2010, Salı


Nasıl yan yana, aynı yükseklikte yan iki divs duruyorum?

İki div yan yana var. Onlara yüksekliği aynı olması gibi, ve eğer onlardan biri yeniden boyutlandırır aynı kalmak istiyorum. Bunu rağmen çözemiyorum. Fikirler?

Edit: İşte Not Defteri yaptığım bir maketi:

Edit: aşağıdaki bağlantıyı önerdi denemek için Güncellendi, ama hala şans yok.

Edıt: açıklığa kavuşturmak İçin benim kafa karıştırıcı soru istiyorum hem kutuları için her zaman aynı boyutta olan, bu yüzden eğer bir büyür, Çünkü metin içine yerleştirilmiş, diğeri büyümesini maç boyu.

<div style="overflow: hidden">

<div style="border:1px solid #cccccc; float:left; padding-bottom:1000px; margin-bottom:-1000px">

Some content!<br/>
Some content!<br/>
Some content!<br/>
Some content!<br/>
Some content!<br/>

</div>

<div style="border:1px solid #cccccc; float:left; padding-bottom:1000px; margin-bottom:-1000px">

Some content!

</div>

</div>

CEVAP
18 Aralık 2013, ÇARŞAMBA


Flexbox

3 yıl sonra senin emrinde flexbox var. Bu düzen varsayarsak:

<div class="row">
    <div class="col">...</div>
    <div class="col">...</div>
</div>

Flexbox ile aynı boyda sadece bir bildirimi:

.row {
    display: flex; /* equal height of the children */
}

.col {
    flex: 1; /* additionally, equal width */
}

Tarayıcı desteği: http://caniuse.com/flexbox; demo: http://jsfiddle.net/sdsgW/

Masa düzeni

Eğer hala IE 8 veya 9, sonra da destek için gerekirse masa düzeni kullanmak zorunda:

.row {
    display: table;
}

.col {
    display: table-cell;
    width: 50%; /* depends on the number of columns */
}

Demo: http://jsfiddle.net/V7CQF/

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • BrandonHarrisWalker

    BrandonHarri

    27 Kasım 2006
  • Glove and Boots

    Glove and Bo

    1 ŞUBAT 2007
  • Virtual Riot

    Virtual Riot

    19 Mayıs 2011