Bonjour,
J'ai un problème que je n'arrive pas à résoudre : Aligner 1 image et 2 blocs div (logo.jpg, elembandeau et fetejour) dans un bandeau. A priori c'est pourtant simple mais bon...
Les blocs div sont naturellement affichés verticalement, mais même avec des display:inline je n'arrive pas à régler le pb...
J'ai mis volontairement des bordures autour des blocs pour voir mais sous Firefox, ces bordures ne font pas la bonne taille..
Vous trouverez surement qu'il y a des div inutiles mais c'est fait exprès..
Voic imon code html :
Et mon code CSS :
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
16
17
18
19 <body> <div id="container"> <div id="bandeau"> <img src="logo.jpg" width="155" height="123" alt="" /> <div id="elembandeau"> <img src="bandeau.jpg" width="582" height="123" alt="" /> </div> <div id="fetejour"> <div id="fj_haut"> <img src="logohaut.jpg" width="230" height="57" alt="" /> </div> <div id="fj_bas"> <img src="logobas.jpg" width="230" height="57" alt="" /> </div> </div> </div> </body>
Merci à tous de votre aide !
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
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 div#container { margin-top:50px; width:990px; margin-left: auto; margin-right: auto; background-color:#abcdef; border: 1px solid #000; } div#bandeau { width:990px; height:230px; background-color:#00CCFF; border: 1px solid red; } div#elembandeau { display:inline; width:583px; border: 2px solid green; } div#fetejour { width:230px; height:123px; border: 2px solid red; } div#fj_haut { margin-left: 0; margin-top: 0; } div#fj_bas { margin-left: 0; margin-top: 0;
Steph
Partager