1
http://jsfiddle.net/kWJ79/17/Styling <hr> n'affiche pas comme prévu
- Pourquoi mon
<hr>si court? - Pourquoi l'écart au bas du
#wrapperest-il plus grand que la taille de remplissage de 20px spécifiée?
A
Répondre
2
le parent
<div id="vr">à votre<hr>est réglé sur la largeur 1px (et float: left) de sorte que le<hr>est 1px largel'
#wrapperdispose d'un espace supplémentaire en raison de la classe#wrapper:afterpseudo ajouter undisplay:blocketcontent:"."à la fin de l'emballage lui donne une ligne supplémentaire au fond, ce n'est pas un rembourrage supplémentaire
peut-être considérer comme #wrapper {overflow:hidden;} une alternative à l'utilisation d'une classe :after pseudo
+0
Désolé je veux dire court horizontalement, je voudrais que son fond soit en ligne avec le fond du rembourrage #wrapper moins. – Sebastian
+0
J'ai mis 'html, body, # wrapper' à' {height: 100%} 'qui permet à' # vr' de remplir la hauteur de '# wrapper', aussi il semble que la bordure soit appropriée pour avoir un fond ligne au bas de '# wrapper' si je vous comprends bien. check this http://jsfiddle.net/pxfunc/kWJ79/25/ – MikeM
0
Le hr ne semble pas courte pour moi. Quel navigateur utilisez-vous?
La raison pour laquelle il semble y avoir padding sur le #wrapper est parce que vous avez du contenu en elle (wrapper::after) qui est rendu par le navigateur pour sa hauteur, il inclus dans le div wrapper. Edit: vu le hr, pour une raison quelconque, je l'ai manqué lors de l'examen du code dans Chrome. Comme dit précédemment, le div contenant est seulement 1px.
0
#vr est défini sur height: 100%, il prend donc toute la hauteur de son parent, #wrapper. Qui ne contient que des enfants flottants et n'a pas de hauteur spécifiée. Vous pouvez spécifier la hauteur de #vr en tant que height: 554px; et il s'alignera. Ou vous pouvez spécifier une hauteur sur #wrapper mais cela nécessitera d'autres mods.
+0
#wrapper n'a pas de hauteur car il s'adapte à ses enfants. Comme le contenu est dynamique, je ne peux pas spécifier exactement la hauteur de #vr. Il y a-t-il des alternatives? – Sebastian
+0
pourquoi ne pas vous débarrasser de '# vr' et juste ajouter ces règles à' # right': 'border-left: 1px solid #bbb; rembourrage-gauche: 0,5em; marge gauche: 0.5em; ' –
Questions connexes
- 1. WPF Styling ne fonctionne pas comme prévu
- 2. Styling input type = le fichier ne fonctionne pas comme prévu
- 3. Pourquoi "<= 1" ne fonctionne-t-il pas comme prévu?
- 4. Classe réglage pas comme prévu
- 5. JFrame n'agit pas comme prévu!
- 6. constructeur n'imprime pas comme prévu
- 7. ne fonctionne pas comme prévu
- 8. CustomAttributes comporte pas comme prévu
- 9. Styling l'élément <hr />
- 10. <textarea> intérieur <foreignObject> poignées comme prévu dans Chrome, mais pas Firefox
- 11. Styling <tr> dans Treeview
- 12. Styling pour <input nécessaire ...> WebKit
- 13. ToDictionary ne fonctionne pas comme prévu
- 14. Jquery append() n'est pas comme prévu
- 15. PIVOT ne fonctionne pas comme prévu
- 16. SQL dynamique ne fonctionnant pas comme prévu
- 17. décodage d'URL ne fonctionne pas comme prévu
- 18. Jquery ne fonctionne pas comme prévu
- 19. nième-enfant ne fonctionne pas comme prévu
- 20. PHP Dateformat ne fonctionne pas comme prévu
- 21. str.startswith() ne fonctionne pas comme prévu
- 22. Javascript ne fonctionne pas comme prévu, pourquoi?
- 23. ShowWindow de User32 n'agit pas comme prévu
- 24. "$ _. Extension -eq" ne fonctionne pas comme prévu?
- 25. JavaScript if() instruction n'évaluant pas comme prévu
- 26. Les Rails ne fonctionnent pas comme prévu
- 27. Apache mod_rewrite ne résout pas comme prévu
- 28. scénario JQuery ne fonctionne pas comme prévu
- 29. set_time_limit ne fonctionne pas comme prévu?
- 30. Cron ne fonctionne pas comme prévu
'
' = Règle horizontale, pas de règle verticale. – Phil