<分区>
在下面的代码中<span>
有一张我想调整大小的图片。此外,wrapper 应该采用调整后图像的高度,而不是采用原始图像的大小。此外,此问题仅发生在 firefox 中。
HTML
<div class="wrapper">
<label> India </label>
<span class="visa visa01"></span>
</div>
CSS
.wrapper {
width: auto;
border-radius: 3px;
background: #dadada none repeat scroll 0% 0%;
padding: 2px 10px;
display: inline-block;
float: left;
}
label {
display: inline-block;
max-width: 100%;
}
.visa {
width: 1.6em;
top:1px;
position: relative;
}
.visa01 {
content: url("/images/waww/resume/visa01.png");
}
.visa01:after {
position: relative;
top: 25px;
width: 70px;
height:50px;
display: inline-block;
transform: scale(0.4);
content: url("/images/waww/resume/visa01.png");
}
知道如何将 wrapper 的高度设置为 visa01 的新高度。
最佳答案
乍一看问题是由于 transform
属性引起的。我不确定为什么在声明静态 height
和 width
时要使用 transform
属性。尝试省略 transform
来代替手动调整的 height
和 width
(因为无论如何你都是静态声明的)你可能不再有这个原始图像“容器”可以说是获得设定尺寸,但随后被转换
(并且新尺寸现在由 wrapper
拾取)的问题。
关于html - 如何使父容器调整其高度以仅使用 css 匹配缩放的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36145190/
相关文章:
css - 如何使用 CSS 变换以正确的视角将两个或多个立方体并排放置?
css - Animation then transform,两个连续的动画
javascript - focus() 在隐藏 div 内的输入上不起作用
html - 在居中的 Bootstrap 3 网格旁边创建一个固定的侧边栏
css - Blueprint CSS Framework/Sticky Footer with IE6 问题
javascript - jQuery 拖动/调整大小与 CSS 变换比例
javascript - 网站性能测试 : How best to approximate computer performance?