Empty ul with border only

[salman83]

hi,
i am trying to create empty ul list with 1 px border with no list items but it still showing the content area height as 1 px but even i have set the padding to 0. How can i achieve the 0 pixel height of the content area but with 1px border. here is my code

See the Pen mxxGZm by Salman ( @salman83) on CodePen.

https://static.codepen.io/assets/embed/ei.js

[Paulie_D]

i am trying to create empty ul list with 1 px border with no list items

Why?…What is the point.>

Just us a div if you must.

[salman83]

I know that. But i want to create an empty list first, then populate it later

[Paulie_D]

Here’s the thing…a 1px border is actually 2px (top & bottom) and you can’t set a border-width to less than 1 px.

So, if you want an element to be only 1px tall, it should have no content (or whitespace), no padding and only a single border..say border-top:1px solid black…and no other border.

https://codepen.io/Paulie-D/pen/yKjaXv

[Author]

Posts