我在 www.poggen.com 有一个静态网站,我正在尝试减小右边第三个弹性框中徽标的大小以匹配其他两个,但我根本无法进行任何更改.我尝试直接将高度和宽度属性添加到 SVG (
<svg style="max-width:50px;max-height:50px;"
),但这除了使 SVG 在移动站点上几乎无法辨认之外没有任何区别。如何缩小 SVG 以匹配其他两个徽标和移动设备上的正常大小?请帮忙
编辑 - 更改
.text-image img
宽度会更改所有三个 SVG 徽标的大小。
这是我为 infoflex 框和相应的图像容器编写的 CSS。我不确定为什么移动 SVG 的大小显着减小,但宽屏网站保持不变。
/*infoboxemain css*/
.infoboxemain {
padding-bottom: 120px;
position: relative;
z-index: 2;
}
.infoboxemain .infoflexbox {
display: flex;
justify-content: space-between;
margin: -105px -30px 0;
}
.infoboxemain .infoboxes {
background: #EFF3F9;
border-radius: 10px;
margin: 0 30px;
width: calc(33.33% - 60px);
padding: 0px;
}
.infoboxemain .infoboxes .image-container .bg-image {
width: 100%;
}
.infoboxemain .infoboxes .image-container .text-image {
position: absolute;
vertical-align: middle;
text-align: center;
}
.text-image img {
width: 95%;
}
.infoboxemain .infoboxes .image-container {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
position: relative;
}