que - Ancho de CSS 100% O ancho máximo en píxeles

style width html

Question

Cómo se podría crear una regla CSS para ancho que

• Utiliza un ancho del 100% por defecto

• Si el ancho del 100% excede cierto ancho de píxel (digamos 512 px), entonces el ancho se fija a este ancho de píxel

No estoy seguro acerca de las relaciones de ancho y ancho máximo, o cómo se admite calc () o podría expresar esto. Esto debería funcionar con los últimos navegadores WebKit y Firefox 4. No es necesaria la compatibilidad con IE8 etc.

Answer 1

Si se trata de un elemento de nivel de bloque, debe ser 100% por defecto, por lo que no es necesario declarar el ancho, y luego max-width: 512px; lo reduciría

calc() no es compatible en absoluto, pero en este caso no creo que lo necesites

Answer 2

De hecho, es el uso previsto del max-width . Si el width calculado (real) de un elemento excede max-width , estará restringido al valor máximo en lugar de ir más allá. El porcentaje frente a los píxeles no es relevante.

Declare ambos en la misma regla así (sin necesidad de la función calc() ):

#somediv {
    width: 100%;
    max-width: 512px;
}

Answer 3

div{ max-width: 512px; }

debería ser suficiente.