html - Div 在任何移动 safari 上都被拉伸(stretch)

Question

我有一个带有 div 的幻灯片，它们是图像的选择器。它们只是带有边框的 div。这是除了移动 safari 之外的每个浏览器的样子

这是移动版 Safari

这是他们的 css:

.slick-dots {
  padding-left: 0px;
  text-align: center;
}
.slick-dots li {
  display: inline-block;
  list-style-type: none;
  margin: 0 3px;
}
.slick-dots li button {
  background: #fff;
  border: 1px solid #000;
  border-radius: 0;
  height: 18px;
  width: 18px;
  opacity: 1;
  color: transparent;
}
.slick-dots li.slick-active button {
  background: #000;
}

.inspiration .slick-dots,
.destinations .slick-dots {
  padding-left: 0px;
}
.inspiration .slick-dots li button,
.destinations .slick-dots li button {
  background: none;
  border: 1px solid #fff;
}
.inspiration .slick-dots li.slick-active button,
.destinations .slick-dots li.slick-active button {
  background: #fff;
}

.slick-slide img {
  display: inline !important;
}

它以像素为单位设置为 18px 的高度和宽度。看起来如果我将宽度更改为 18px 以下，它的宽度不会变小......有没有人以前见过这样的东西？

Answer 1

请删除你的宽度和高度并像这样设置css

padding:9px;

这可能会解决 safari 问题