28111 sujets

CSS et mise en forme, CSS3

CSS Bootstrap|Centrer Verticalement

Bonjour ou Bonsoir

J'utilise des petites images pour une page d'un site, qui sont situés dans une Div d'une ligne de bootstrap, mais je n'arrive pas à les centrer verticalement
upload/1510848705-67776-capture.png

Comment puis je faire svp ?
J'ai déja test un vertical-align : middle mais il ne fonctionne pas 


<div class="col-md-3 col-xs-3 pictos"> 
                    <div class="col-md-2 col-xs-2">
                        <img src="images/picto/picto_best.png">
                    </div>
                    <div class="col-md-2 col-xs-2">
                        <img src="images/picto/picto_certifiant.png">
                    </div>
                    <div class="col-md-2 col-xs-2">
                        <img src="images/picto/picto_cpf.png">
                    </div>
                    <div class="col-md-2 col-xs-2">
                        <img src="images/picto/picto_elearning.png">
                    </div>
                    <div class="col-md-2 col-xs-2">
                        <img src="images/picto/picto_jeux.png">
                    </div>
                    <div class="col-md-2 col-xs-2">
                        <img src="images/picto/picto_new.png">
                    </div>
                </div>



.pictos img
{
    width: 50px;
    height: auto;
}

Modifié par OnePunch (16 Nov 2017 - 17:15)
Modérateur
et comme ceci ?


.pictos{
  display: flex;
  justify-content: space-between;
}

.pictos > *{
  margin: auto 0px;
}
Bonjour,
Si tu connais la hauteur max de tes images (ex:50px), essaye de jouer sur le line-height.

.pictos > div{
    line-height:50px;
    min-height:50px;
    vertical-align:middle; 
}
Sujet clos
Aller à