Version imprimable
Bonjour bonjour. Cela fait maintenant une semaine que j'essaye de centrer verticalement l'ensemble de la page d'accueil de mon site. J'ai lu plein d'articles sur divers forums mais je n'ai pas trouvé de réponses valables étant donné que le centrage doit se faire SANS que l'on définisse la hauteur d'un bloc.
Peut-être est-ce tout simplement impossible ?
Vous pouvez voir la page sur :
http://www.guillaumebaron.com/
PS : Je suis compositeur.
Montre ton code plutôt car on sait pas comment tu as construis tes pages et ton css.
avec ça tu devrais t'en sortir.
html:
css:Code:
2
3
4
5
6
7
css ie:Code:
2
3
4
5
6
7
8
9
10
11div.conteneur { text-align:center; /* centrage horizontal */ } div.bloc { width:100px; margin:0 10px; /* espacement horizontal des blocs */ border:1px solid #fff; display:inline-block; vertical-align:middle; text-align:left; /* on rétablit l'alignement du texte */ }
Code:
2div.bloc { display:inline; /* correctif inline-block */ }
Bonsoir, oui j'avais testé cette solution ma ça marche pas du tout...
Voilà mon code :
Et pour le css :Code:
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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
Code:
2
3
4
5
6
7
8
9
10
11
12
Voilà voilà. Le problème doit venir des tableaux etc... C'est relou l'informatique !!!! ^^
en faisant quelque chose comme ça en l'adaptant avec les dimensions de tes blocs ça passe.
Code:
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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
Alors j'ai testé et bidouillé le code, et ça marche enfin !
Seulement deux nouveaux problèmes sont apparus du coup. Je sais pas si ils sont facilement résolvables.
1 - Le premier c'est que du coup mes lignes "HR" sont délimitées par la zone de 60 em. Avant elles faisaient toute la largeur de la fenêtre.
Lorsque je les mets en dehors de la DIV, elles sont systématiquement affichées en haut de la fenêtre.
2 - Le deuxième problème c'est que avec mes solutions TABLE, le texte s'adaptait en fonction de la largeur de la fenêtre. Même pour une tout petit fenêtre. Maintenant la zone est définie par la taille 60em et lorsque l'on diminue la fenêtre, au lieu d'avoir une adaptation du texte, on a le droit a un petit ascenseur horizontal.
Je chipote j'avoue mais je suis assez perfectionniste. Si tu as les solutions et le courage, je prends ! :ccool:
Edit : Le css que j'ai au final :
Tu peux voir le résultat ici : http://www.guillaumebaron.com/Code:
2
3
4
5
6
7
8
9
10
11
12
13
14
Tu pourrais essayer cela:
Code:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16#centre { height: 30em; left: 50%; margin: -15em 0 0 -50%; position: absolute; top: 50%; width: 100%; } #centm { display: inline-block; margin: -3em 0 0; position: absolute; vertical-align: middle; width: 100%; }
Génial Franck, ça marche enfin, exactement ce que je voulais.
1 - Adaptation horizontalement parfait même pour une toute petite fenêtre.
2 - Adaptation verticalement.
Merci énormément pour ton aide et le temps que tu as passé ! :ccool: