Bonjour,
Un ptit problème de CSS que je n'arrive pas à résoudre.
Site en ASP.net :
- Page en hauteur 100% si contenu < taille page avec footer en pied de page (pas de problème).
- Si contenu > taille page alors le contenu s'aggrandit en hauteur mais le footer reste en pied de page (donc descend pour toujours se placer en dessous du contenu)
Problème : Si contenu trop grand le footer ne descend pas (cf screenshot)
Code simplifié (pas de page en ligne) :
Code HTML : 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 <!-- Container --> <div id="container"> <!-- Header --> <div id="header">...</div> <!-- Centre --> <div id="centre"> <!-- Contenu --> <div id="contenu"> <!-- Fin Contenu --> </div> <!-- Fin Centre --> </div> <!-- Footer --> <div id="footer">...</div>
Code CSS : 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 /* Container */ #container { position:relative; margin:auto; width:100%; text-align:left; min-height:100%; background-color:#ADC387; } /* Header */ #header { height:234px; width:100%; z-index:0; margin:0; } /* Centre */ #centre { min-height:100%; overflow:auto; padding-bottom:76px; } /* Contenu */ #contenu { width:100%; } /* Footer */ #footer { position: absolute; bottom: 0; left: 0; clear : both; width : 100%; height : 76px; background-color : #CCC; }
Merci pour vos réponses
EDIT : La page Aspx contient un UserControl chargé via Ajax. Je me demande si le problème ne viendrait pas de là. Car sur d'autres pages, aucun soucis.
Partager