Discussion :

[MInfo25]

Bonjour,
Je souhaiterais aligner horitalement et verticalement 2 images situées dans un même bloc mais je bloc, j'ai éssayé plusieurs choses mais ça marche. Les 2 images doivent se coller !
J'ai mis les fichiers en ligne, voici : http://domaine.allkers.com/
Voici mon code :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div class="row">  <div class="col-sm-12 col-md-12 col-lg-12">
    <div id="bloc3">
      <div class="backcolor">
        <img src="img/bloc31.png" alt="">
 
 
        <img src="img/bloc32.png" alt="">
        </div>
 
 
        <div id="partenaires">Nos partenaires</div>
      </div>
    </div>
 
  </div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
        #bloc3 img:nth-child(1)
        {
          position: relative;
          left: 10%;
          top: 5%;
          width: 50%;
        }
        #bloc3 img:nth-child(2)
        {
          position: relative;
          right: 10%;
          top: 5%;
          width: 30%;
 
        }

[Invité]

Bonjour,

1-

[COLOR=#404852]...Les 2 images doivent se coller ! ...

Alors, il faut qu'elle le soient dans le code HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

        <img src="img/bloc31.png" alt=""><img src="img/bloc32.png" alt="">

Une variante :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
        <img src="img/bloc31.png" alt=""><!--
 
        --><img src="img/bloc32.png" alt="">

En effet, les images sont par défaut en "inline".
Sans cette astuce, un espace se crée automatiquement.

2- Quant au positionnement, il faut vraiment que tu apprennes le CSS (pas juste "bidouiller").

• A Complete Guide to Flexbox
• Utilisation de boîtes flexibles de CSS

• display:table / display:table-cell fonctionne aussi très bien.

[MInfo25]

Ok mais je n'ai pas toujours la mise en page que j'aimerais obtenir qui est comme ceci :

[MInfo25]

C'est bon j'ai trouvé la solution, en fait il y avait un mauvais code qui bloquait la bonne mise en page