Comment puis-je obtenir une mise en page de pages remplies sans défilement dans ASP?

La page principale ressemble actuellement à ceci:
(Non, je ne travaille pas pour Google Les images sont des espaces réservés..)Comment puis-je obtenir une mise en page de pages remplies sans défilement dans ASP?

<body> 
    <form id="frm" runat="server"> 
     <%--Header (Main Logo)--%> 
     <div align="right"> 
      <asp:Image ID="HBannImg" runat="server" AlternateText="Google" 
       ImageUrl="http://www.google.com/intl/en_ALL/images/logo.gif" /> 
     </div> 
     <%--Navigation Bar--%> 
     <div> 
      <asp:Image ID="NImg1" runat="server" AlternateText="GMail" 
       ImageUrl="https://mail.google.com/mail/help/images/logo2.gif" /> 
      <asp:Image ID="NImg2" runat="server" AlternateText="Images" 
       ImageUrl="http://images.google.com/intl/en_us/images/logos/images_logo.gif" /> 
      <asp:Image ID="NImg3" runat="server" AlternateText="Videos" 
       ImageUrl="http://video.google.com/img/logo_videos.png?hl=en" /> 
     </div> 
     <%--Main Content--%> 
     <div style="background-color: #000000; color: #FFFFFF;"> 
      <asp:ContentPlaceHolder id="CPHBody" runat="server" /> 
     </div> 
     <%--Footer--%> 
     <div align="center" 
      style="position: absolute; bottom: 0px; text-align: center;"> 
      © 2009 all rights reserved 
     </div> 
    </form> 
</body>

L'en-tête et nav-bar sont correctement affichés jusqu'à présent.

Cependant, le pied de page doit être centré. Et le bloc de contenu de la page doit remplir l'espace entre la barre de navigation et le pied de page, indépendamment de la taille du contenu réel. Si le contenu est plus grand que cet espace, je veux qu'une barre de défilement apparaisse à l'intérieur du bloc de contenu, plutôt que sur la page entière. Ainsi, l'en-tête ET le pied de page doivent toujours être visibles, peu importe où l'utilisateur a fait défiler la page.

Est-ce que quelqu'un sait comment cela peut être accompli?
Si une partie de ma description n'est pas claire, n'hésitez pas à demander plus de détails.

Source

2009-10-04 Giffyguy

J'ai dû supprimer l'image de votre publication car ImageShack l'a supprimée et l'a remplacée par de la publicité. Voir http://meta.stackexchange.com/q/263771/215468 pour plus d'informations. Si possible, ce serait génial pour vous de les télécharger à nouveau. Merci! – Undo

@Undo C'est dommage. Imgur doit les mettre à la faillite. J'avais l'habitude d'utiliser ImageShack en 2009 et 2010, donc il y a peut-être plus de mes anciens messages utilisant les hôtes ImageShack - mais je n'ai toujours pas de copies locales des images qui traînent. Je me demande si je pourrais recréer cette capture d'écran en utilisant le code dans la question ... ASP.NET 2.0 je pense? Peut-être 2,5? Ou était de 3,0 autour en 2009? Je vais devoir voir si je peux faire tourner un hôte IIS avec l'ancienne version correcte du .NET Framework. – Giffyguy

Vous pouvez ajouter des barres de défilement à une div avec ce code. La barre de défilement apparaîtra automatiquement si le contenu est trop grand pour s'adapter.

div.content 
{ 
    overflow: scroll; 
}

Cela ne vous obtenez à mi-chemin, puisque vous devez également définir la hauteur de la div contenu afin que la page entière a une hauteur de 100%. C'est mon expérience, que vous ouvrez un grand sac de problèmes de compatibilité du navigateur si vous essayez d'utiliser height: 100%. Vous pouvez également utiliser JavaScript pour définir la hauteur de la div sur document.load et document.resize, mais cela donnera un petit scintillement quand la page se chargera.

Je pense que la meilleure solution serait de superposer l'en-tête et le pied de page sur le contenu de la page et de rendre leurs positions fixes. Cela attacherait la barre de défilement à la fenêtre et non à la balise div, ce qui en ferait la hauteur totale, donc ce n'est peut-être pas ce que vous voulez. Il y a un bel exemple sur la façon d'accomplir ceci ici: Fixed header and footer.

Source

2009-10-04 18:35:49

Comment puis-je obtenir une mise en page de pages remplies sans défilement dans ASP?

Répondre

Questions connexes