Faire mon site fluide

Question

Je suis en train de créer un site Web « fluide » et avoir dans mon fichier css:

page-wrap{ 
    min-width: 780px; 
    max-width: 1260px; 
    margin: 10px auto; 
    } 

Dans mon modèle pour la page, j'ai mon corps principal du texte réglé sur une largeur de 80% et centré. Mon intention est que lorsque je rends la fenêtre de mon navigateur plus petite, cela enlèvera l'espace blanc sur les côtés gauche et droit du corps jusqu'à ce qu'il n'y ait plus d'espace autour du corps. À ce stade, une barre de défilement horizontale apparaît. Je ne suis pas sûr si je l'ai expliqué clairement, mais un exemple serait comme stackoverflow.com, avec les espaces sur les côtés gauche et droit du corps étant supprimés lorsque vous réduisez la fenêtre du navigateur. Malheureusement, avec ce que j'ai, l'espace autour de mon corps principal reste le même tandis que mon corps principal s'ajuste à la largeur de 80%. Alors, que dois-je faire pour le corriger et atteindre les résultats souhaités? Ai-je besoin d'une taille fixe pour cela au lieu d'un pourcentage?

Answer 1

C'est assez simple, tout ce que vous devez faire est d'avoir une largeur fixe sur votre div page avec des marges automatiques.

#page-wrap 
{ 
    width:780px; 
    margin:10px auto; 
} 

Oubliez la largeur min/max.

Answer 2

Ce n'est pas clair pour moi. Si vous utilisez, pour la largeur 80% de la largeur de la fenêtre disponible, il est normal que le bloc se redimensionne pour s'adapter ... Vous devez avoir une largeur fixe pour la partie centrale.

J'utilise ceci:

#centerdiv { 
position: absolute; 
width:950px;  
left: 50%; 
margin-left:-475px; }