Salut à tous, je travaille actuellement sur le CSS d'un futur site de vente de produits dérivés.
Mon site se découpe en 5 blocs comme suivant :
Le head qui contient la bannière et le moteur de recherche
Puis trois blocs alignés : menu, centre et news
Puis le bloc bottom pour le pied de page.
Je voudrais que ce bloc bottom bouge en fonction du contenu du bloc centre (logique) mais aussi du menu (logique aussi me direz-vous)
Tout marche sous IE7 (j'ai pas essayé sous IE6 et j'ose pas), mais sous Firefox seul le bloc centre fait bouger le bottom en fonction du contenu.
Voici le lien pour voir ce que ça fait : Megapolis
Voici le code de ma page index et celui de mon 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
20
21
22
23
24
25
26
27
28
29
30
31
32 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Megapolis, vente de produits dérivés (Cinéma, Mangas, Jeux en tout genre)</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="bloc_site"> <div id="bloc_top"> <?php include ("head.php"); ?> </div> <div id="bloc_new"> new </div> <div id="bloc_menu"> <?php include ("menu_dynamique.php"); ?> </div> <div id="bloc_centre"> centre<br> kjhqevrlhjvb </div> <div id="bloc_bottom"> <?php include ("bottom.php"); ?> </div> </div> </body> </html>Merci d'avance à ceux qui m'aideraient.
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
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 *{ margin: 0px; padding: 0px; } div { position:relative; } body { padding: 0px; text-align: left; color: #000000; font-family: verdana,helvetica; font-size: x-small; } img { border: none; } #bloc_site { width:800px; margin:auto; background-color:#FFFF00; } #bloc_top { background-color:black; width:800px; height:100px; } #bloc_menu { float:left; width:140px; margin:-350px 0px 0px 0px; background-color:#FFFFFF; } #bloc_centre { width:510px; min-height:350px; margin:-350px 0px 0px 140px; padding:7px; } #bloc_new { background-color:red; width:150px; height:350px; margin:0px 0px 0px 650px; } #bloc_bottom { background-color:#33FF00; width:800px; height:130px; /*bottom:0px;*/ }
Partager