css – div忽略样式表中的高度

这真让我抓狂.我似乎无法控制下面的div.down_arrow元素的高度 –

...
<div id="filters">
    ...
    <span>All</span>
    <div class="down_arrow">
        <img src="images/down_arrow.png" alt=""/>
    </div>
    ...
</div>
...

我有以下css –

#filters {
    float: right;
    padding: 24px 10px 0 0;
}

#filters div {
    display: inline;
}

#filters div.down_arrow,#filters div.down_arrow img {
    height: 12px;
    width: 23px;
}

#filters div.down_arrow:hover ing {
        opacity: 0;
}

safari开发工具告诉我div.down_arrow的高度和宽度仍然有效(即没有通过属性的行 – 没有其他任何东西覆盖它们).但是屏幕上的小弹出窗口显示div.down_arrow的尺寸为27px x 16px.我可以看到元素大于它包含的img元素.

我不明白发生了什么 – 看起来高度似乎取自前面的span元素(我不知道是什么影响了宽度).

解决方法

更改显示：内联;显示：内联块;

问题是您只能手动控制块元素的宽度/高度,而不是内联元素.

原文地址：https://www.jb51.cc/css/214803.html