/ / Направете колоните винаги с еднаква височина? (Фондация 5) - фондация "zurb-foundation"

Направете колоните винаги с еднаква височина? (Фондация 5) - фондация "zurb-foundation"

Как да създадете оформление, както е показано на изображението? Първата колона вляво и втората правоъгълна колона винаги трябва да са на една и съща височина, в зависимост от първата височина на колоната, използвайки Фондация 5.

въведете описанието на изображението тук

Отговори:

0 за отговор № 1

Еквалайзера на фондацията ще ги направи равномерни, но въз основа на по-дългия. http://foundation.zurb.com/docs/components/equalizer.html

можете да използвате jQuery, за да го направите сами по този начин (това може да работи с много колони и с всяка колона като тази, определяща размера:

$(document).ready(function() {
sizeRow();

function sizeRow() {
var $col = $(".sizeRow .size-by-me");
var height = $col.height();
$col.siblings(".size-me").height(height);
}
});
.small-6 {
float: left;
width: 50%;
}
.col1 {
height: 400px;
background-color: #F00;
}
.col2 {
height: 200px;
background-color: #FF0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div class="row sizeRow">
<div class="small-6 columns size-by-me col1">Column 1</div>
<div class="small-6 columns col2 size-me">Column 2</div>
</div>


Свързани въпроси


Коментари (0)

Добави коментар