blog.nayma.pl


Dla miłośników WordPress, WooCommerce, HTML5, CSS3 oraz JS.

Podziel się


Tagi


Szybkie wyrównanie 2 div

Pewnie nie raz mieliście problem z wyrównaniem dwóch div na ta samą wysokość. Nie zawsze jesteśmy w stanie skorzystać z display:flex. Wtedy z pomocą przyjdzie nam prosta funkcja Java Script, która wyrówna za nas obydwie kolumny. Wystarczy przez zamknięciem znacznika umieścić następujący kod:

var rightHeight = document.getElementById('right').clientHeight;  
var leftHeight = document.getElementById('left').clientHeight;  
if (leftHeight > rightHeight) {  
document.getElementById('right').style.height=leftHeight+'px';  
} else {
document.getElementById('left').style.height=rightHeight+'px';  
}

Pamiętajmy również że każda z kolumn musi mieć dodane odpowiednie klasy: .left oraz .right.

Miejmy nadzieję, że kod przyda się niejednemu z was i ułatwi troszkę życie 😉

A może wy macie równie ciekawe pomysły na wyrównanie 2 kolumn na tą samą wysokość. Podzielcie się z nami waszymi sposobami w komentarzach.

Nayma.pl Dariusz Okoń
Dodane przez

Nayma.pl Dariusz Okoń

Komentarze