[CSS]Probleme de contenu trop grand et de pied de page

**Drannor** · 29/05/2005, 02h18

Bonsoir et merci de lire ce post

J'ai fait une mise en page CSS pour mon site de tel sorte :

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
61
62
63
64
65
66
.banniere
     {
      top : 0% ;
      width: 50%;
      height: 15%; 
      position:absolute; 
      background-color: blue;
      left: 25% ;
      z-index : 2 ;
     }
 
.menu
       {
	top: 30% ;
        width: 13%;
        height: 50%;         
        position: absolute ;
        background-color: red;
        left:0% ;
        z-index : 2 ;
        }
 
 .haut_fresque
        {
	top :21%;
	height :9% ;
	width : 96%;	
	position:absolute; 
	background-color: orange;
	left: 0% ;
     z-index : 2 ;	
    }
 
	.englobe_contenu
	{
	 top : 30% ;
	 height :60% ;
     width : 96% ;	 
	 position : absolute ;
	 background-color: blue ;
     left: 0% ;
	 z-index : 1 ;
     }	 
 
	.contenu
      {       
        top: 30% ;
	    height: 60%; 
	    width: 80%; 
        position: absolute; 
        background-color: purple;
        left: 15% ;
		z-index : 2 ;
	}
 
 
 .bas_fresque
      {
	  top : 90% ;
	  height : 10% ;
	  width : 96% ;
	  position: absolute ;
	  background-color: black ;
	  left :0% ;
      z-index : 2 ;	  
   }

Hors voila j'ai un énorme problème que je ne sais résoudre, j'ai tenté nombre de chose mais rien n'a marché.

Comment faire lorsque mon contenu dépasse le cadre de la "zone contenu" en violete pour que celle ci s'adapte et s'agrandisse entrainant le bas de frasque avec lui.

Pour essayer d'être plus clair, j'ai un formulaire dans mon code html qui dépasse du cadre violet d'au moins 40 %, et le cadre lui ne s'agrandit pas donc le pied de page reste au meme endroit. Ce qui donne un pied de page au milieu du formulaire avec une fin de formulaire qui ère dans du vide tout blanc.

Si quelqu'un à une solution, je l'en remercie d'avance car j'avoue être désespéré.

ps : je pensais que le pourcentage était relatif non pas à la taille de l'écran mais au contenu de la page hors ce ne semble pas etre le cas :s .

**ilood** · 29/05/2005, 12h59

J'aurai bien tenté de t'aider mais sans le code html c'est flou

**Drannor** · 29/05/2005, 13h45

Un code si ce n'est que ça

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
<?php
function ecriture()
{
for ($i=1; $i < 400; $i++)
{
echo'Bienvenue sur Devellopez.com !!' ;
}
}
 
echo'<html>
<head>
<meta http-equiv="content-type" type="text/html; charset=iso-8859-1"> 
<link rel="stylesheet" type="text/css" href="./style.css">
</head>
<body>
<div class=banniere></div>
<div class=haut_fresque></div>
<div class=englobe_contenu></div>
<div class=menu></div>
<div class=contenu>';
ecriture();
echo'</div>
<div class=bas_fresque></div>
</body>
</html>';
 
?>

Voila c'est exactement le genre de pb que j'ai

**Olivier_** · 29/05/2005, 14h37

Ca vient du fait que tu utilises le positionement absolu.

Utilises les float avec en plus clear: both; sur le pied de page et tout ira bien.

**Drannor** · 30/05/2005, 00h21

Merci beaucoup Olivier_

Je ne connaissais pas l'existence de la balise Float. Dans ma mémoire il me semblait que c'était un attribut à l'attribut position mais j'ai du confondre avec fixed.

Pour autant, il reste un problème si j'utilise float : left . Comment faire pour que le menu et le contenu se superpose à .englobe_contenu et que celui ci prenne la meme hauteur que "contenu".

Car sur mon site jai un parchemin avec une bordure enroulé ou je voudrait superposé le menu et sur le parchemin déroulé, je voudrais afficher le contenu.

Seul problème c'est qu'il faut que le morceau de parchemin enroulé qui represente le menu, soit de meme longeur que le parchemin déroulé. Afin que les deux concordes, j'avais pensé faire un conteneur nommé englobe contenu qui aurait comme background le parchemin enroulé sur la gauche + le parchemin déroulé en une seule image.

Tout en pensant à ce que le .englobe contenu prenne la hauteur de .contenu mais ce ne semble pas être le cas.

Y'a t'il un moyen ou dois je abandonné ce design ?

**v4np13** · 30/05/2005, 07h08

Moi je dirais que le problème vient des marges, vous n'avez pas fixé des marges et de là viendrait le décalage.
Si vous voulez centrer les fenêtres faites:

Code :

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