Почему так работает border в css?

Question

[Никита Нафранец]

Мне может, кто-нить объяснить, почему правый бордер блоков как бы внутр входит? А не снаружи появляется. По-моему логике правый бордер должен выходить из блока и идти в доступное ему место в правую сторону, но вместо этого он идет как бы внутрь блока.
Нашел какую-ту статью про border на хабре, но она мне не дала ответ.
https://jsfiddle.net/hwck06xq/
При этом, если создать обычный блок и прифигачить ему бордер, то он будет действовать как надо.

Answer 1

[Сергей delphinpro]

Потому что ширина auto

Comments

[Никита Нафранец]

Я поставил ширину 50%
https://jsfiddle.net/hwck06xq/1/
Эффект такой же.

[Никита Нафранец]

Ясно, спасибо, я понял о чем вы говорите. Если я указываю ширину всему списку, то border-right заходит внутрь, а если указать li, то наружу. Я так, понимаю, border-right не может выйти за блок обертку и начинает заходить внутрь.

Answer 2

[Сергей Горячев]

Ничего не понятно, но столько букв не может быть шуткой.
Видимо, у человека не только с бордерами проблема, но и с объяснением проблемы.
Окей, будем разбираться :)
Покажите скрины, как у вас и как должно быть, пожалуйста.

Comments

[Никита Нафранец]

Спасибо, но человек уже ответил. Я просто не подумал, что из-за того, что блок не может выйти за блок, он начинает border-right стоить внутрь, а не снаружи.

[Андрей]

Никита Нафранец: если вы думали что border это что-то "снаружи", то нет - это тоже самое что и padding только с заливкой

[Никита Нафранец]

Бордер при width: не авто, как раз ведет себя как снаружи по моему мнению, а с width: auto, как padding. И я так считаю как раз потому, что border не расширяет content при значении width: не авто.