CSS: Possibilité de "pousser" les barres de défilement Webkit dans le contenu?
Normalement une barre de défilement est positionné comme ceci:
________________________________________
| | |
| content | scrollbar |
| | |
| | |
| | |
| | |
|__________________________|___________|Au fond, je cherche à avoir un écart entre une "mesure" de la barre de défilement et de la limite extérieure d'une zone déroulante contenant:
________________________________________
| | | |
| content | scrollbar | gap |
| | < | |
| | | |
| | | |
| | | |
|____________________|___________|_____|À l'aide d'un margin-right sur ::-webkit-scrollbar ou ::-webkit-scrollbar-track-piece échoue et l'annonce de la feuille de style, capable de barres de défilement pour Webkit états:
Marges sont pris en charge le long de l'axe de la barre de défilement. Ils peuvent être
négatif (de sorte que la piste peut par exemple être gonflé pour couvrir les
boutons en partie).
Je vais maintenant me demandais si quelqu'un a réussi à repousser les barres de défilement "dans" le contenu (ou de l'emballage d'ailleurs) par d'autres moyens que margin.
Je suppose que cela pourrait être possible uniquement (même si) à l'aide d'une sorte d'astuce — des idées?
D'autres choses que j'ai essayé, sans succès, sont padding-right: 10px et border-right: 10px solid rgba(255, 255, 255, 0) (une bordure transparente).
source d'informationauteur polarblau
Vous devez vous connecter pour publier un commentaire.
Je pense que c'est pas possible par l'attribution d'une marge de droite pour un aligné à droite de la barre de défilement. La barre de défilement est la partie de la fenêtre de l'INTERFACE utilisateur et ne peut pas être appelée via CSS.
Cependant, vous pouvez simplement créer un contenu-wrapper autour de tous les autres éléments de votre code HTML, de lui donner un max de largeur qui est inférieure à 100% et mis
overflow: scroll;pour le wrapper. Cela permettra d'obtenir l'effet désiré et de travailler dans presque tous les navigateurs.[avis perso] je pense que c'est une très mauvaise habitude de certains web-designers, qui veulent contrôler toutes les pièces de mon écran. Par exemple les barres de défilement doit être appelée par le gestionnaire de fenêtres non pas par le site, je suis en train de visionner.
Vous pouvez le faire avec une bordure transparente. Mais vous devez définir
background-clip: padding-box;ou il ne fonctionnera pas.Exemple: http://jsfiddle.net/6KprJ/1/