Comment compenser la barre de Défilement Verticale lorsqu'il n'est pas encore présente

Question

C'est peut-être une solution facile, mais il a été me rend fou pour un long moment donc j'ai finalement décidé de voir si une solution existe.

Bref, je centre de la plupart de mes pages web à l'intérieur de l'échelle de la vue-des ports.

Exemple, un point de vue-port pourrait être capable de 1028px et je veux que ma page largeur de seulement 960 px.

Donc mon css ressemble à ceci:

#pageWrapper { /* page width is 960 pixels */
    margin:0 auto;
    width:960px;
}

Pas de problème avec ça.

Le problème vient quand je commence une page dynamique qui est plus courte que la hauteur de et puis, ma page s'élargit (via jQuery slideOut, etc.) ci-dessous le bas de l'écran et les causes de la barre de défilement verticale à apparaître.

Il finit par faire la page de scintillement de gauche au cours de la slideOut et puis le scintillement de droit au cours de slideIn.

Est-il un chemin à travers les css pour forcer un 20px marge de droite et tout de même profiter de margin:0 auto; ?

Merci.

Answer 1

Lorsque le contenu de la page n'est plus apte à la verticale, le navigateur ajoute une barre de défilement sur le côté droit de la fenêtre.Cela modifie la largeur disponible dans la fenêtre du navigateur, de sorte que tout le contenu qui est soit centré ou positionné par rapport à la partie droite de la fenêtre se déplace à gauche un peu.C'est très commun.

Il y a un certain nombre de moyens pour contrôler cela, mais la plus commune est de faire en sorte d'avoir toujours une barre de défilement ou de ne jamais avoir une barre de défilement par le contrôle de la overflow-y bien sur la fenêtre.

Réglage overflow-y: scroll va forcer les barres de défilement pour toujours être là.

Réglage overflow-y: hidden force il n'y à jamais de barres de défilement.

Answer 2

NB: overflow-y: hidden empêche l'utilisateur de faire défiler vers le bas par tous les moyens, effectivement le rendu de tout contenu inférieure à la fenêtre inaccessible.