28172 sujets

CSS et mise en forme, CSS3

[Résolu] Hauteur réglable

Bonjour,

Je bute sur un pb de réglage de hauteur.

Je souhaite avoir un carré responsive, à l'intérieur duquel j'aurai un autre carré responsive, puisque ce dernier sera entouré d'une "bordure" de taille fixe.

Pour ce faire j'ai séparé le premier carré en 3 lignes différentes, dont les 2 extrêmes ont une hauteur fixe de 50px, et celle du milieu serait d'une hauteur réglable : c'est cependant là que je suis bloqué....

Voici mon code :
https://codepen.io/mscou/pen/yLyWmqX

Merci d'avance pour votre aide
Modérateur
Hello,
Le fait d'ajouter simplement ce code fera l'affaire :
.boussole .boussole-content {
	display: flex;
	flex-direction: column;
.boussole-ligne-2 {
	flex-grow: 1;
}

Ceci dit, je supprimerais les positions absolutes, float etc pour garder un code plus simple. Et vu ce que tu veux faire, je changerais complètement en partant sur un display: grid.
Voilà un peu de lecture pour t'aider Smiley smile
Meilleure solution
Sujet clos
Aller à