I'm trying to do something pretty simply; change the border colour of an input. In both IE11 and latest stable Chrome, changing the color also changes how it looks (appears 3D/thicker):

If I try "1px solid red" then the border looks the same, but the size changes!
- Why does changing the colour seem to do more than just change the colour
- How can I just change the colour without changing anything else (style, thickness, spacing, size, etc.)
I've tried messing with border-width and other properties, but none of them result in the exact same size/spacing as the default with only the colour changed :(
(Please try your changes in JSFiddle before posting... so many people are posting bad answers and then deleting them! http://jsfiddle.net/S2TxT/4/)
<input type="text" value="Default" />
<input type="text" style="border: 1px solid red" />