28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je me permets de poster ce message car j'ai une petite difficulté.

J'ai créé une div qui prend la forme d'un carré.
Cette div prend place à côté d'un paragraphe. Pour ce faire, j'ai utilisé flexbox.

Sauriez-vous me dire pourquoi la div en forme de carré se déforme lorsque qu'on diminue la fenêtre alors qu'elle a des valeurs exprimées en pixels (60px x 60px).

Aussi, je souhaite que la div reste à côté du paragraphe. Je n'utilise pas flex-wrap: wrap;

Mon code

Merci Smiley smile
Modifié par MickFR (27 Dec 2018 - 13:34)
Administrateur
Bonjour,

Ton carré se déforme car, comme chaque flex item, la valeur de sa propriété flex-shrink est à 1 par défaut.
Tu peux l'empêcher de se rétrécir en lui appliquant un flex-shrink: 0;

Bonne journée et excellentes fêtes de fin d'année Smiley smile
Meilleure solution
Bonjour,

Merci beaucoup Smiley smile
Une petite relecture du cours sur flexbox ne me fera pas de mal.

Très belle fin d'année.