html - CSS max-width 无效；代替使用的宽度

Question

我正在尝试将元素设置为以像素为单位的特定大小，或者，如果超过屏幕的某个百分比，则为屏幕的该百分比。

我环顾四周，似乎max-width应该可以解决问题，但事实并非如此。

相关的CSS是：

ul.images {
  width: 10000px;  
  max-width: 10%;
}

10000 远大于 100%，因此宽度应该是 10%，但它只使用 10,000。这是在 Chrome 中。我怎样才能解决这个问题？

score 0 · Accepted Answer

原来是因为一个

display: table;

在 CSS 中。

由于某种原因，删除它修复了它。

score 0 · Accepted Answer

我认为您可能遇到的问题与paddingandmargin的uland有关html, body。

这能解决你的问题吗？jsFiddle

html, body {
  padding: 0px;
  margin: 0px;
}
ul.images {
  width: 10000px;
  max-width: 100%;
  padding: 0px;
  margin: 0px;
}

如果这解决了您的问题，那么max-width工作得很好，您遇到的唯一问题是与 the 及其包含元素的 the和 themax-width: 100%相结合，比.paddingmarginul100%

score 0 · Accepted Answer

您的 ul 的父容器是否固定/绝对没有指定宽度？我用一些示例代码创建了一个小提琴，当 ul 不是绝对父级的子级并且父级具有指定的宽度时，它工作正常，但当它是时不起作用。

3 回答 3