Bonjour,
Malgré toutes les lectures (et elles sont nombreuses et variées!) je n'arrive toujours pas à positionner les footers des pages web de manière à ce qu'ils soient en bas d'écran quelque soit l'écran, si le contenu est plus petit que la page affichée...
A priori, c'est un sujet bateau, maintes fois résolu, mais j'avoue ne pas y arriver malgré les dizaines de publication testées...
Ma structure :
- un body qui contient une form
- Dans cette form un div "container" possédant une hauteur minimale de 100% et une position relative
- Du contenu géré en "PlaceHolder" (c'est ça qui bloque ?)
- Un div de bas de page en position absolu, bottom = 0, largeur 100% contenant mon texte de bas de page
D'après mes lecture, cette configuration de positionnement absolu dans une div positionnée en positionnement relative avec une hauteur de 100% du viewport est la solution préconisée...
Ci dessous mon code :
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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38 <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="~/Diogene.css" type="text/css" rel="stylesheet" /> <title></title> <script runat="server"> </script> </head> <body style="height: 100%;margin:0;padding:0; margin-bottom: 0px; position:relative; height:100%;"> <form id="form1" runat="server"> <asp:ScriptManager EnablePartialRendering="true" ID="scMain" runat="server"></asp:ScriptManager> <div id="Container" style="min-height:100%;position:relative;"> <div style =" height : 50px; color: #000000; background-color: #000000; border-bottom:thin;"> <asp:Label ID="Label3" runat="server" Text="Evengate Diogene" Font-Bold="True" Font-Names="Calibri" Font-Size="Small" ForeColor="White" ></asp:Label> <asp:Label ID="Label5" runat="server" Text="Connexions Sécurisées" Font-Bold="True" Font-Names="Calibri" Font-Size="XX-Large" ForeColor="White" ></asp:Label> <asp:Button ID="BT_ModificationMDP" runat="server" PostBackUrl="~/Pages_Connectees/Changement_MDP.aspx" Text="Modifier ma connexion" /> </div> <p style="margin-left: 40px">Voici la liste des éléments que vous avez souhaité pouvoir controler à distance </p> <div style="height: 600px; margin-left: 46px"> <asp:PlaceHolder ID="PlaceHolder1" runat="server" ></asp:PlaceHolder> </div> <div id="BasDePage" style="position: absolute; bottom: 0; left: 0; width: 100%;"> <p>© <%: DateTime.Now.Year %>- Evengate Applications</p> <!--<p> © <%: DateTime.Now.Year %>- Evengate Applications</p> --> </div> </div> </form> </body> </html>
Si quelqu'un voit ce que mon code devrait faire pour y arriver ...
Merci par avance,
BSharp34
Partager