较小屏幕上的 Flexslider 图像重叠
Flexslider Image overlap on smaller screens
我正在尝试使网页具有移动响应能力,但是 flexslider 中的图像在较小的屏幕上会歪斜。无论是加载还是缩小,右边的图像都会侵占当前图像。
我想要 post 一张图片,但我需要更多声望点数。
我想弄清楚如何将正在查看的当前图像推过去,以免过早显示下一张图片的边缘。
只需要添加一个媒体查询以在特定点应用 margin-left。只是暂时找不到要定位的规则:
.slides:first-child img{
height: auto;
}
//fixes the bug where the second image appears on the right on smaller screens
@media (max-width: 991px){
.slides:first-child img{
margin-left: 40px;
}
}
.flex-control-thumbs{
margin-top: 20px;
li{
cursor: pointer;
list-style-type: none;
}
}
我正在尝试使网页具有移动响应能力,但是 flexslider 中的图像在较小的屏幕上会歪斜。无论是加载还是缩小,右边的图像都会侵占当前图像。
我想要 post 一张图片,但我需要更多声望点数。
我想弄清楚如何将正在查看的当前图像推过去,以免过早显示下一张图片的边缘。
只需要添加一个媒体查询以在特定点应用 margin-left。只是暂时找不到要定位的规则:
.slides:first-child img{
height: auto;
}
//fixes the bug where the second image appears on the right on smaller screens
@media (max-width: 991px){
.slides:first-child img{
margin-left: 40px;
}
}
.flex-control-thumbs{
margin-top: 20px;
li{
cursor: pointer;
list-style-type: none;
}
}