.content {
width: 200px;
height: 150px;
padding: 20px;
background: yellow;
overflow: scroll;
box-sizing: border-box;
}
3 Réponses :
Le rembourrage est correctement appliqué comme vous pouvez le constater en faisant défiler vers le bas, le seul "problème" est que la barre de défilement passe au-dessus de cet espace.
Je suppose que vous voulez dire le rembourrage au bas du contenu défilé. Cela semble être un problème de navigateur - voir les commentaires. Mais avec le code suivant, il devrait fonctionner correctement dans tous les navigateurs em>. Transférez certains des paramètres du conteneur, puis cela fonctionne comme si vous le souhaitez: P> p>
<div class="container">
<div class="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Pariatur amet, vitae fuga provident et quae aut minus voluptate quidem maiores at recusandae sit deleniti quia dolore, illum reiciendis! Hic, optio Lorem ipsum dolor sit amet, consectetur adipisicing
elit. Fugit accusantium, obcaecati dicta unde repellat illo maxime! Magni officiis, culpa nihil, sequi aliquid vel voluptas quidem laboriosam, omnis nam fuga veniam.</div>
</div>
Je n'ai pas répondu, mais le résultat final ressemble exactement à la même chose que dans le jsfiddle.
@Guyincognito Non, cela ne signifie pas: Si vous faites défiler le bas, il y a un rembourrage de 20px au bas (fond jaune), qui n'est pas là dans le violon de la question.
Le rembourrage est là dans le jsfiddle sur mon navigateur. Je ne sais pas si c'est à cause du navigateur (chrome).
Hmm. Sur Firefox, il n'y a pas de fond de rembourrage dans le violon.
Le problème est probablement causé par les barres de défilement.
Il s'agit d'une solution de contournement avec des pseudo-éléments en CSS, mais cela pourrait résoudre votre problème:
Edit: Retirez le bas du remplissage de l'élément de contenu pour le faire fonctionner dans tous les navigateurs:
.Content :: après {content: ''; bloc de visualisation; largeur: 100%; Hauteur: 20px; }
.Content {bas de remplissage: 0px; }
Cela semble être un problème de navigateur (Crome Oui, Firefox no) - voir ma réponse. Donc, cette solution de contournement entraînerait une double "rembourrage" (40px hauteur) sur les navigateurs qui font montrent le fond-fond ...
Vous pouvez donc vous en débarrasser de celui-ci dans l'élément de contenu. Merci pour le commentaire, voyez mon édition.