Hacker News new | ask | show | jobs
by adamwathan 2560 days ago
Borders still affect the positioning of things even with box-sizing set to border-box. For example, here "Block 1" is still two pixels taller than "Block 2":

<div style="padding: 8px; border: 1px solid black"> Block 1 </div>

<div style="padding: 8px;"> Block 2 </div>

https://jsfiddle.net/t4rkvfzx/

1 comments

Does that really matter though? A difference of 2px for something temporary doesn't seem like much concern. While I understand the implication is that these can accumulate and cause larger layout issues, the purpose of this practice is to highlight those areas to remove that accumulation anyway
The bigger issue is that you don't know if a UI inconsistency is a bug or a side-effect.