html - 为什么 max-width 对此不起作用？

Question

使用普通的旧 CSS，为什么 'max-width' 在以下情况下不起作用:

button {
  text-align: center;
  max-width: 540px;
  height: auto;
  display: block;
  padding: 10px 0;
  margin: 0 auto;
  border: none;
}

这个元素的包装器:

#wrapper {
  max-width: 1024px;
  overflow: hidden;
  position: relative;
  margin: 0 auto;
  padding: 0 50px;
  text-align: center;
}

编辑

添加到 jsfiddle 的代码:http://jsfiddle.net/BXdrG/

Answer 1

要使 max-width 正常工作，您的元素首先需要一定的 width。使用 100% 来实现您想要的。看这里:

http://jsfiddle.net/QsHa9/