Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Joe Malki
550 PointsHow to set padding/margin values to less then 1px/1em/1% ?
Hi! Thank you for reading my question. :) I understand that this is not possible to set padding/margin values to less to 1px/em/%. However, if I want for instance, to customize my navigation bar, for instance, to a value which is less then 1px/em/%, to satisfy my design request, how do I go for this please?
Thanks heaps! Joe
2 Answers
Tushar Singh
Courses Plus Student 8,692 PointsYou can set it to "0px" or even "0.2em", anything you like less than the "1".
Sebastian Janisiewicz
8,823 PointsWhy do you want to set something smaller than 1px? Images on your screen are made from pixels and they cant be displayed any smaller. When you set value of margin/padding or anything else smaller then that you would not see any difference because displays actually can't display anything smaller then 1px. So you would see either 1px or 0 (depends on yours browser rounding, but propably enythig bigger than 0 will be displayed as 1px).
For em and % there are few other conditions about visibility of values smaller than 1. For example 1% width from FullHD (1920x1080) is 1.9px so you would see propably it like 2px on your screen. If you decrease it by half you will get 0.95px so you will see it like 1px. From that poin the only one value smaller than that to display is 0.
I hope you will uderstand me ;)
Joe Malki
550 PointsSebastian Janisiewicz and Tushar Singh, thank you so much for your answers. What I'm trying to understand or to establish here actually is to resize a navigation bar (the dark blue bar here: https://joemalki.tinytake.com/sf/NjI0MjY3XzMwNzIxNjM), using padding/margin. But perhaps it's the wrong tool to do so?
Joe Malki
550 PointsJoe Malki
550 PointsThanks Tushar. But even 0.1em gives me the same result as 1px. I need less than that :)
Tushar Singh
Courses Plus Student 8,692 PointsTushar Singh
Courses Plus Student 8,692 PointsCan you share your code please, then I can actually see what's happening.What's the issue really? Because if you are applying padding to something with less than 1, you won't actually see it practically because it's almost negligible or if it's the other case if you are trying to reduce the padding, it should work. You may wanna check developer tools and see what's really happening or you can share your code here
Tushar Singh
Courses Plus Student 8,692 PointsTushar Singh
Courses Plus Student 8,692 Pointsyou can use negative values as well, for eg
margin:-50px;