/ / Spalten immer gleich groß machen? (Stiftung 5) - Zurb-Stiftung

Stellen Sie Spalten immer gleich hoch? (Stiftung 5) - Zurb-Stiftung

Wie erstelle ich ein Layout wie im Bild gezeigt? Die erste Spalte links und die zweite Spalte rechts sollte immer die gleiche Höhe haben, abhängig von der ersten Säulenhöhe, mit Foundation 5.

Bildbeschreibung hier eingeben

Antworten:

0 für die Antwort № 1

Foundation Equalizer wird sie gleichmäßig machen, aber basierend auf dem längeren. http://foundation.zurb.com/docs/components/equalizer.html

Sie können jQuery verwenden, um dies selbst zu tun (dies kann mit vielen Spalten funktionieren und mit jeder Spalte, die die Größe bestimmt:

$(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>


Verwandte Fragen


Kommentare (0)

Einen Kommentar hinzufügen