J'ai deux je veux Je pourrais probablement faire une commande de barre de défilement artificielle à l'aide de JS. Si possible, je préférerais une solution d'aspect native basée sur CSS, cependant. Je pourrais mettre un morceau de remplissage séparé où le existe un moyen d'y parvenir, du moins dans les navigateurs modernes? div éléments; L'un d'eux avec une barre de défilement sur le côté: div a pour être exactement aussi large que div b moins la largeur de sa barre de défilement. La barre de défilement est toujours là (par explicite Overflow: défilement ). Otoh div a est de hauteur fixe et n'a pas besoin de défilement. Je veux que les zones client de div a et div b doivent être alignées. ? sur l'image est, si Je savais en quelque sorte quelle est la largeur dépendante de la plate-forme de la barre de défilement.
3 Réponses :
Autant que je sache, CSS seul ne le fera que si vous vous adaptez HTML et optez pour un peu de compromis.
pas un pixel parfait STROND> SOLUTION, mais étant donné que les scolliers ne sont pas identiques à partir de Un navigateur à un autre ... p> Demo forte > p> Test HTML: P> .ab {
width:200px;
background-color:gray;
}
.sc {
width:200px;
padding-right:1.1em;
height:100px;
overflow:auto;
}
.sc .ab {
height:200px;/*demo purpose */
}
Vous pouvez créer une fonction simple JavaScript pour calculer la largeur de la barre de défilement. Il suffit de définir une largeur de div ( http://jsfiddle.net/mljkr9ce/1/ html: CSS: js: puis définissez cette valeur comme rembourrage. < fort> mais qui peut être inutile, car presque tous les navigateurs principaux (sinon tous) ont une barre de défilement de largeur de 17 px: voir Cet article avec les résultats du test chrome v34 17 pixels
Internet Explorer v11 17 pixels
Internet Explorer V10 17 pixels
Donc, essentiellement, je pense qu'un simple Overflow: Faites défiler et d'une DIV intérieure et soustrayez leur offsetwidth :
un remplissage de 17px pourrait suffire, même si l'article indique que l'article est une pratique courante d'utiliser une base de 20 px.
Il existe OSX et la configuration Ubuntu par défaut, à la fois assez répandues parmi le public cible de la page en question. Dans les deux, la barre de défilement est initialement une bande très étroite avec un contrôle de défilement sur la souris sur la souris.
Une autre possibilité utilise uniquement CSS, et elle est très fiable.
sur le top DIV, créez une DIV intérieure pour contenir le contenu et un pseudo fonctionne comme un charme: http://jsfiddle.net/4gu5mkzy/1/ après élément pour générer la barre de défilement largeur. J'ai utilisé un Affichage: Tableau Aligment pour rester en ligne, mais d'autres techniques feront aussi:
Vous devriez vraiment faire une tentative d'une tentative avec un JS FIDDLE
Vous serez probablement en sécurité si vous accédez à une largeur fixe pour les 3 navigateurs principaux sur Desktop textfixer.com/tatudials/browser-scrollar-width.php
Y a-t-il un problème si c'est une solution JS?
Vous pouvez utiliser un élément supplémentaire pour maintenir la barre de défilement et une valeur de rembourrage sécurisée pour le garder de côté assez loin: Codepen. io / anon / stylo / xyrst
@LCSAlazar: une solution JS irait bien, tandis qu'un CSS serait très agréable.
@Gcyrillus: la solution de rembourrage est agréable, à l'exception de la constante magique de la largeur de la barre de défilement. C'est bien mieux que rien, cependant; Merci.
merci, j'ai fait une réponse de cela et ce que j'y pense :)