My intention for the script below (and also located at http://jsbin.com/enOxEya/1/) is just to remove the right border.
For FF, Chrome and IE, however, it makes the left and top border bold.
Furthermore, for FF, it removes the bottom border, and for Chrome and IE, it shades the bottom border.
See images for each browser (all browsers are fairly up to date)
Results from FF
Results from Chrome
Results from IE
Using border style none to just the top, bottom, and left border also produces unexpected results for all browsers.
How do I just remove a single border (i.e. the right one) without effecting the other three borders?
<!DOCTYPE html>
<html>
<head>
<title>Boarders</title>
<style type='text/css'>
#input2 {border-right-style:none}
</style>
</head>
<body>
<input id="input1" />
<br />
<br />
<input id="input2" />
</body>
</html>
Best Answer
Try this,it works fine
just replace
with this
hope this helps you.