Discussion :

[tactact]

Bonjour,

J'ai presque fini mon site à quelques détails prés dont un très gainant !

Il m'est impossible de centrer verticalement ma div qui contient le mot "Design + glyphycon random" dans mon footer noir .... Voici le code :









Merci par avance de votre aide ... je suis un peut au bout du bout là ^^

[Invité]

Bonjour,

il faudrait copier-coller les codes HTML et CSS (nécessaires et suffisants) directement dans le corps du message.
(on ne va pas se le recogner à la main pour pouvoir tester...)

Une page une ligne serait un plus.


Sinon, voir : vertical-align.

[tactact]

Bien sur pour celui qu cherche ça sera plus évident !! Voila :

Mon code HTML :

Code HTML :

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

1
2
3
4
5
6
7
8
9
10
<footer class="pied-page">
        <div class="bloque" id="Premier">
            <p id="Titre">Design &nbsp;&nbsp;&nbsp;<i class="glyphicon glyphicon-random"></i></p>
        </div>
        <div class="bloque" id="Second">
            <h5><a href="mailto:Tgaron@supinfo.com" class="email"> Contactez-moi par email :</a> Thibaut.GARON@supinfo.com</h5>
            <h5><i class="glyphicon glyphicon-earphone"></i>&nbsp;&nbsp;&nbsp; 06-76-05-22-48</h5>
            <a id="référence">&copy; 2018 salonepitete.fr | par Thibaut.G</a>
        </div>
    </footer>

Mon code CSS associé :

Code CSS :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
footer {
    background-color: black;
    position: relative;
    height: 100px;
    text-align: center;
}
 
.bloque {
    display: inline-block;
    text-align: center;
    font-size: 14px;
}
 
#référence {
    text-decoration: none;
    color: #fff;
}
 
#Second {
    padding-top: 5px;
}
 
#Titre {
    position: relative;
    display: inline-block;
    text-align: center;
    margin-right: 50px;
    color: rgb(236, 203, 36);
    font-size: 21px;
}

Pour ce qui est de vertical-aligne ... j'ai déjà essayé et impossible, je pense qu'elle entre en conflit avec d'autre propriétés CSS mais lesquelles ?

[tactact]

Sujet résolu !!!! J'ai utilisé vertical-aligne sur les 2 DIV de mon footer, alors que je cherchais à le faire que sur une seule

Ensuite j'ai ajusté comme il faut avec margin-top/bottom

Merci à toi ! Sujet clôt

[jeremd41]

Je me demande si c'est pas display: inline-block qui pose problème...

Essaye de l'enlever et fait un vertical-align: middle;

[tactact]

Nan ça passe avec le inline-block Merci quand même ^^