The button bottom of IE6 disappears and does not display

Recently, when the website was revised, it was found that IE6 had a strange problem. It was a very common button with a border, but it was not displayed in the lower border of IE6. IE7 was not tested and I don't know if it was not displayed, other browsers are normal

The code and preview results are as follows:

<Style> body {font-size: 12px; font-family: tahoma, Arial, verdana, \ 5b8b \ 4f53, sans-serif; color: #666 ;}. BTN {display: inline-block; line-Height: 23px; padding: 0 10px; Border: solid 1px red; text-Decoration: none; Vertical-align: middle ;} </style> <a class = "BTN" href = "#"> one button </a>

 

Here we will talk about our solutions. Multiple solutions can be found through testing.

1. Change the body font declaration to Arial font-family: Arial, tahoma, verdana, \ 5b8b \ 4f53, sans-serif.

2. Remove the vertical-align value of the button.

3. Block and float buttons

Test conjecture should be caused by the font and vertical-align: middle question ???

The button bottom of IE6 disappears and does not display