Home/ Questions/Q 9143627
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T10:04:15+00:00

I have the following HTML markup which result to an input form element of

  • 0

I have the following HTML markup which result to an input form element of type text.

<!DOCTYPE html>
<html>
    <body>
        <input type="text" />
    </body>
</html>

In a decent browser it render like the following screen capture (in the right side the zoomed image):

Sample

Then, why when inspecting the <input> element the browser show a border width of 2px? We can visually appreciate the input element has 1 pixel. Even with jQuery when I do something like jQuery('input').css('border-width') it spit out 2px.

Of course, this is happening only with unstyled form input elements.

I also created a JsFiddle demo:http://jsfiddle.net/HBDUZ/

Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Each browser has a built-in stylesheet (called a “user agent stylesheet”), which contains default styling for certain elements.

    In this case (Chrome 25 beta-m, Windows), the style is:

    border: 2px inset;

    The result of inset is really visible in this JSFiddle, with a contrasting background color.

    • 0