0

please refer to 12th row in CSS at this link: http://jsfiddle.net/NLTf9/

in 12th row, I need at least .0743em border width to make it visible in Chrome and Opera last versions as of today. (I mean the borders of input and button)

for .0742em, borders are not visible. what I don't understand is 1em = 16px so 1px = .0625em and even .0742em > .0625em why the browser can't display the border?

what is the reason for this issue? Please aware that I use box-sizing: border-box; if it's important!

if reason is these browsers can't display if display width value < 1px so why .0743em = 1px here?

I think I don't know and missing some important equation here! can you please explain?

regards

Andre Chenier
  • 1,126
  • 2
  • 16
  • 36
  • See http://stackoverflow.com/questions/13891177/css-border-less-than-1px – stephenhay Jun 17 '14 at 21:22
  • thanks. I saw that Q however it doesn't help me, I don't need to display border thinner than 1px. (.0625em [for the case that 1em=16px]) I want to understand despite .0742em > .0625 em, no border is visible for 2 browsers. I didn't changed any display preferences. So I assume 1em is still equal to 16px for me! – Andre Chenier Jun 18 '14 at 06:02
  • You'd have to make sure that 1em is indeed 16px within the context of the element. Looks like .09em is the smallest value that will round to 1px in your example. Browsers also round differently. See also http://stackoverflow.com/questions/7656883/using-fractional-ems-in-csss-font-size-property. – stephenhay Jun 19 '14 at 11:54

0 Answers0