Largura mínima - CSS-Tricks | CSS Almanac 2025

A min-widthpropriedade em CSS é usada para definir a largura mínima de um elemento especificado. A min-widthpropriedade sempre substitui a widthpropriedade se seguida antes ou depois widthem sua declaração. Os autores podem usar qualquer um dos valores de comprimento, desde que sejam um valor positivo.

.wrapper ( width: 100%; min-width: 20em; /* Will be AT LEAST 20em wide */ )

Confira esta Caneta!

Esteja atento ao presumir que min-widthé herdado, pois essa propriedade não é herdada de outros elementos pai. Se os autores definirem uma largura usando um valor absoluto (px, pt, pol, cm, mm), a largura mínima não terá efeito, pois a largura foi definida indefinidamente. Por exemplo, se um valor de 200px for usado como widthcomprimento, seu min-widthvalor de 100px não será necessário, pois você já especificou um valor absoluto para width(ou seja, 200px). A melhor maneira de usar min-widthé definir um widthvalor como uma porcentagem e usar um valor absoluto para a min-widthpropriedade, caso contrário, usar um valor percentual para ambos min-widthe widthnão produzirá o resultado esperado.