开发者

ie6 <img> in <span> changes line height

开发者 https://www.devze.com 2023-03-08 15:32 出处:网络
There is a little part of code <span class=\"breadcrumbs pathway\"> <a href=\"somewhere.html\" class=\"pathway\">

There is a little part of code

<span class="breadcrumbs pathway">
<a href="somewhere.html" class="pathway">
    link
</a>
<img src="/customs/images/M_images/arrow.png" alt="" />
Архив
</span>

And the problem is that the image height is less 开发者_StackOverflowthan font-size, ant the line, that contains becomes thiner.

Tried to add zoom:1;, display:inline-block or inline with no result

This thing happens only in ie6

UPD

Well, thank you all, guys. I have found a solution to set img styles to display:inline-block; and add a padding-top:0.5em


@M2_ I had also faced the same problem. Try adding reset.css which will reset all the IE styles that browser has by default and you will find here before adding your custom css files. Also create an IE-Only Stylesheet, which will target specifically to IE and for that you can refer this. Hope this will help you.


Have you tried to assign vertical-align: middle; to the image?


sorry, I don't have an IE6 available to test, but have you tried to

  • set the padding and margin to 0? style="padding: 0; margin:0"
  • set the height of the image? style="height: 4px"
  • set the border of the image? style="border: none" or style="border: 0"


Try setting the line-height of <span class="bread-crums pathway"> same heigth as the image.

Ie. if the image has 22px

.breadcrumbs{_line-height:22px}
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号