Bonjour, j'ai une flexbox avec une image et du texte dont j'aimerais que le texte soit à coté de l'image mais j'ai l'impression que le conteneur ne reconnait pas l'image comme un élément faisant partie du dit conteneur.

  <div id="Descrip">

        <div class="photo"><img class="photoM" src="Images/trucCV.jpg" alt="Photo de truc" /></div>

        <div class="NP">truc 1</div>
        <div class="NP">truc 2</div>
        <div class="NP">truc 3</div>
    </div>

.photoM
{
    position: fixed; top: 200px; left: 200px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    max-width: 30%;
    height: auto;
    transform: rotate(0.75turn);
    border: 2px black solid;
}

.photo:nth-child(1)
{
    order: 1;
}

.NP:nth-child(2)
{
    order: 2;
}

#Descrip
{
    display: flex;
    flex-direction: column;
}

Bonsoir, ton container #Descrip est en display flex, les enfants direct sont donc des flex-items.

Les petits enfants ne sont pas impacter par le flexfox.

Pour quelles raisons placer ton image en position fixe? Cela sort l'élément du flux courant. 

Ce que je ne comprends pas également, c'est les propriété de background appliquée à une image HTML alors qu'aucune image de background n'est définie.

Qu’essaies-tu de faire?

-
Edité par AbcAbc6 20 novembre 2019 à 21:09:34

Eh bien juste d'avoir une image au bonne endroit affiché correctement.

et je n'ai pas vraiment compris ça "Bonsoir, ton container #Descrip est en display flex, les enfants direct sont donc des flex-items.

Les petits enfants ne sont pas impacter par le flexfox."

Peut être que ces lectures vous aiderons à comprendre. (en + du cours HTML/CSS de ce site)

• https://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
• https://la-cascade.io/flexbox-guide-complet/

BioHazardeuze a écrit:

Eh bien juste d'avoir une image au bonne endroit affiché correctement.

oui je me doute, mais c'est quoi pour vous le bon endroit, et affichée correctement? Un schéma de ce que vous désirez?

En fonction de votre titre du sujet, supprimez la L26 de votre CSS. Pourquoi placer les flex-items en colonne si vous les voulez en ligne? 

Je voulais mon image se trouve vers le centre de ma page, à une taille précis sans perdre de qualité et orienté dans le bon sens.

Et du coup je voulais avoir d'un coté à gauche, mon image, et à droite mon texte. Je sais que je pourrais utiliser un float pour ça mais le but pour moi est de me familiarisé avec les flexbox. 

Du coup je me suis dit que je devrais peut être faire deux flexbox différentes, une pour l'image et une pour le texte. Après je suis juste pas sûr de savoir si c'est possible de pouvoir faire le placement en fonction des flexbox et non de leur contenue.

AbcAbc6 a écrit:

"En fonction de votre titre du sujet, supprimez la L26 de votre CSS."  

je n'ai pas compris ceci.