Border around Input Number?

Question

I am trying to put a border around it, but i can't. Here is what i have as far as CSS:

body{ margin:1em; }
body *{ font-family: RussellSquare}
body{background-color: #363636;}

input[type=number]{
    font-size:1em;
    width:2.5em;
    padding:3px;
    margin:0;
    border-radius:3px; 
    border: 1px solid #000;
    text-align:center;
}

input[type=number]:focus{
    outline:none;
}

works here... (jsfiddle: http://jsfiddle.net/fNH5q/) Chrome 20 Dev — beardhatcode, May 06 '12 at 18:50
What do you mean it can't? If you are testing on IE, up until IE9 there's no support. — g13n, May 06 '12 at 18:52
It [Works fine here](http://jsfiddle.net/fNH5q/1/). In which browser (versions) are you experiencing the problem? — Rob W, May 06 '12 at 19:27

score 0 · Accepted Answer · edited May 23 '17 at 11:58

0

It works just fine. Try it yourself on different browsers here.

Short explanation would be:

border is CSS property that is supported on all major browsers.

border-radius is CSS3 property that runs on all modern browsers. IE 6/7/8 is not one of them.

In case you want to know more about Internet Explorer support of border-radius

Read: Support for "border-radius" in IE

edited May 23 '17 at 11:58

Community

1
1

answered May 06 '12 at 19:29

Community Driven Business

4,622
1
16
20

Border around Input Number?

1 Answers1