selective border on mouse move over in msie

Question

Hi All,

my following css code does not work in msie.

#block a {
   border-right: 2px none #eee;
   border-bottom: 2px none #eee;
}

#block a:hover {
   border-right: 2px solid #eee;
   border-bottom: 2px solid #eee;
}

In msie, only the right border will be displayed correctly. The bottom border is totally invisible. Other browsers work fine.

can anybody help me, to make it display correctly in msie as well?

demo website is http://mmjd.com (mouse move over the text on the very right side)

Answer 1

The anchor in question is being displayed inline. IE does not recognise the full width and height.

Setting display:block; resolves this.

#block a {
   border-right: 2px none #eee;
   border-bottom: 2px none #eee;
   display:block;
}

#block a:hover {
   border-right: 2px solid #eee;
   border-bottom: 2px solid #eee;
}