Tại sao max-width lại không hoạt động?

Question

Sử dụng đồng bằng CSS cũ, tại sao sẽ không 'max-width' không hoạt động trên như sau:

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

Các wrapper cho các phần tử này:

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

EDIT

Mã được thêm vào jsfiddle: http://jsfiddle.net/BXdrG/

Answer 1

Ah ok, tôi hiểu lầm việc sử dụng nó. Để có được nút chất lỏng không kéo dài đến kích thước lớn, tôi đã thêm các thông tin sau:

width:100%; 
max-width: 540px; 

Cảm ơn người bình luận!

Answer 2

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

    width:100%; /* you forgot this */ 
} 

Answer 3

Đối max-width để làm việc một cách chính xác, yếu tố đầu tiên bạn cần có một số width. Sử dụng 100% để đạt được những gì bạn muốn. Xem ở đây:

http://jsfiddle.net/QsHa9/