Discussion :

[kurkaine]

Bonjour,

Je dois construire une feuille de style pour un CMS. Le menu gauche, le droit et le body du site sont appelé à partir de fonction que je ne maitrise pas. Lorsque j'appelle ces fonctions, le footer ne s'agrandit pas et tout est affiché par dessus le footer. Ces fonctions que je ne maitrise pas construisent des tableaux. Si j'écris dans mon CSS contenant les menus et le body overflow = hidden, évidemment je n'ai plus de débordement mais tout le contenu n'apparait plus, ce qui est pire.

Existe-il une solution pour que mon site s'agrandit automatiquement ? Pour éviter ce problème dois-je recoder mon site en tableau (qui fonctionne puisque les templates que je modifie est construit en tableau)...

Merci de vos réponses.

[Strix]

Salut

Avec du code ce serait plus facile pour nous de voir ton problème.
Et ce n'est pas hyden mais hidden

[kurkaine]

Voilà le css qui construit le menu gauche, le bodyet le menu droit. Le menu gauche et le body se trouve dans une div, et le menu droit dans une autre div. Puis le menu gauche et le body sont découpés en 2 div :

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
#main_body
{
	width:100%;
	height:100% !Important;
	height:1%; 
	height:1000px; 
	background-color:#FFFFFF;
}
 
/* Menu Gauche + Centre */
#content_centre
{
	float:left;
	width:80%;	/* Si je n'ai pas de menu droit, je positionne ici à 100% */
	height:100%;
	background-color:#FFFFFF;
}
 
/* Menu Droit */
#content_droit
{
	float:right;
	width:20%;
	height:100%; 
	background-color:#FFFFFF;
}
 
/* Menu gauche */
#content_centre_gauche
{
	float:left;
	width:25%;	/* Si je n'ai pas de menu droit, je positionne ici à 100% */
	height:100%;
	background-color:#FFFFFF;
}
/* Corps */
#content_centre_droit
{
	float:left;
	width:75%;	/* Si je n'ai pas de menu droit, je positionne ici à 100% */
	height:100%; 
	background-color:#FFFFFF;
}

Le code correspondant :

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
					<!-- MAIN BODY  -->
					<div id="main_body">
 
						<!-- MAIN BODY : Centre  -->
						<div id="content_centre">
 
								<!-- CONTENT CENTRE - Menu Gauche  -->
								<div id="content_centre_gauche">
 
												<!-- Affiche le menu de gauche //-->
												<table border="0" width="100%" cellspacing="5">				
												<?php //echo DIR_WS_INCLUDES . FILENAME_COLUMN_LEF;
												require(DIR_WS_INCLUDES . FILENAME_COLUMN_LEFT); ?>
												</table>
												<!-- fin menu de gauche //-->
 
								</div><!-- fin Menu gauche --> 
 
								<!-- CONTENT CENTRE - Body du centre  -->
								<div id="content_centre_droit"> 
								<?php /* */?>
													<table border="0" width="100%" cellspacing="5">			
													<?php  													
													//-- Si un fichier template existe déjà dans le Répertoire /templates/mon_temp/content 
													//   (define dans le fichier /include/configure.php) --//
													if (isset($content_template) && file_exists(DIR_WS_CONTENT . basename($content_template))) 
													{
															//-- Utilise le fichier dans le répertoire  Content --//
															require(DIR_WS_CONTENT . basename($content_template));
													} 
													else 
													{
															//-- Utilise mon fichier .tpl.php => C'est notre cas --//
															//echo  DIR_WS_CONTENT . $content;
															require(DIR_WS_CONTENT . $content . '.tpl.php');
													}													
													?>
													</table>
								<?php /**/ ?>
								</div><!-- fin body --> 
 
						</div><!-- fin centre --> 
						<!----------------------------------------------------------------->
 
						<!-- MAIN BODY : Droit  -->
						<div id="content_droit">
 
										<!-- Affiche le menu de droit //-->
										<table border="0" width="100%" cellspacing="0" cellpadding="5"> 
										<?php 
										 //echo DIR_WS_INCLUDES . FILENAME_COLUMN_RIGHT;
										require(DIR_WS_INCLUDES . FILENAME_COLUMN_RIGHT); ?>
										</table>
										<!-- fin le menu de gauche //-->
						</div><!-- fin droit --> 
 
						<div id="clear_float"></div><!-- enlève les float --> 
					</div><!-- fin body -->

Le contenu des menus et du body sont généré par le CMS.

C'est compréhensible ?

[Xann_71]

Salut!
Bon alors moi je me pose une question. Dans ton code tu as:

Code :

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

1
2
3
4
5
6
7
8
9
 
#main_body
{
	width:100%;
	height:100% !Important;
	height:1%; 
	height:1000px; 
	background-color:#FFFFFF;
}

D'abord tu déclare ton height à 100%, puis à 1% , puis à 1000px ??!
La j'avoue je comprend pas trop comment sa marche?

[kurkaine]

Heu... Oublie le dernier Hight:1000px, c'était pour un test : et si je fixais la hauteur.

En fait, les deux high à 1% et 100%... C'est un hack que j'ai pu lire afin que la zone s'adapte sur IE et FF.

Je n'ai pas su faire en pure CSS, j'ai du utiliser un tableau qui englobe les menus droit et gauche ainsi que le centre. De cette façon, mes zones s'adaptent bien.

[Xann_71]

Bon j'ai peut etre une solution:
Crée un div qui englobe les deux menus et le body.
ensuite dans ton css, tu mettra "overflow: hidden;" dans la partie qui correspond à ce div.

Explication:
Grâce au "overflow: hidden;", le div qui englobe les trois autres s'adaptera à la taille du plus grand des trois. Vu qu'il n'est pas flottant, le footer s'affichera en dessous.

Si j'ai bien comprit ton problème, essai ça.
Si sa ne fonctionne toujours pas, essai de donner un lien vers ta page et d'afficher ton code source dans un message.

A+