html - 如何在CSS中实现最小左/右

Question

我的 CSS 中有一个元素，如下所示

.xyz{
    position:absolute;
    left:50%;
    }

现在正如预期的那样，当我减小浏览器窗口的宽度时，这个元素向左移动。但是我希望它在某个点停止，否则它会开始与其他元素重叠。原则上，这与 min-height 和 min-width 属性非常相似。但是没有像 min-left 或 min-top 这样的属性。我该如何实现。

Answer 1

如果您可以估计窗口大小，即移动应该停止的位置(比如 700px)，您可以使用媒体查询:

@media (max-width: 700px) {
  .xyz {
    left: 10px;
  }
}

然后对于小于 700px 的窗口，该元素固定放置在 left: 10px(根据您的需要调整 CSS)。