Sync hauteurs de div

Vallyan
Les bases HTML/CSS

Bon, je galère sur la questions suivante, betement:
j'ai deux div cote-a-cote, et je voudrais qu'elles soient de hauteur identique (celle qui a le plus de contenu décide de la hauteur, donc).
J'ai pas de pb pour le faire en JS, mais intuitivement j'aurais pensé que c'était faisable en css directement ... mais impossible d'y arrive.r

Petit codepen: comment qu'on fait en sorte que le truc jaune moche soit de la hauteur du truc bleu moche ?

A noter que je connais ce hack: http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks, mais qu'en l'occurence il ne me convient pas puisque ce n'est pas la div mais le container de derrière qui est ajusté a la hauteur.

Merki !

8 réponses

coloo
Réponse acceptée

Le cache misère :

*{margin:0;}
.container{overflow: hidden;}
#nav-container {
  float: left;
  width: 30%;

}
nav {
  border-radius: 5px;
  background-color: yellow;
  width: 90%;
  padding-bottom: 500em;
  margin-bottom: -500em;
}
main {
  background :green;
  float: left;
  width: 70%;
}

Ce que je ferais : 

*{margin:0;}
.container{position:relative;}
#nav-container {
  position:absolute;

  left:1%;
  top:0;
  bottom:0;  
  width: 29%;

}
nav {
  height:100%;
  border-radius: 5px;
  background-color: yellow;
  width: 90%;

}
main {
  margin-top:5px;
  background :green;
 margin-left:30%;
  width: 70%;
}
Vallyan
Auteur

Alors c'est pas parfait vu qu'il me manque mon morceau de nav du bas (avec le border-radius et un box-shadow qui disparaissent), mais c'est de très loin ce que j'ai vu de mieux jusqu'a présent.
Merci mon Coloo :)

Je laisse ouvert un moment si quelqu'un a une alternative, mais si non je te valide ton truc.

coloo

J'ai édité vava :p me laisse pas le temps de chercher dans mes fagots aussi :p, y a pas de shadow box ? enfin je le vois pas sur le codepen...

Vallyan
Auteur

Bien joué, ca fonctionne comme un charme.
Et effectivement il n'y avait pas le box-shadow sur le codepen :/

Merci :)

coloo

Je suis un pro de la balise p, je vais m’intéresser à la balise li maintenant ^^.

++

Vallyan
Auteur

coloo ?

coloo

vava ?

Vallyan
Auteur

Je t'aime mon coloo <3