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

  • Phlearn Photoshop and Photography Tutorials

    Phlearn Phot

    11 EKİM 2011
  • THELIFEOFPRICE

    THELIFEOFPRI

    16 Mart 2011
  • thetrollska

    thetrollska

    2 EKİM 2009