¿Hay alguna manera de establecer las propiedades CSS de altura/ancho a algo así: 100% - 50px Entonces, si el 100% total es 1000px, entonces el resultado final sería 950px. Y el 100% lo establece el tamaño del navegador.ancho/alto de CSS pixel y porcentaje de cálculo combintaion?
ACTUALIZACIÓN: Lo que estoy tratando de hacer es:
Tengo dos div, la altura de la primera div es 50px, quisiera altura de la segunda div para cubrir el espacio restante.
Después de buscar en la red, me di cuenta de que no se puede hacer. La única manera de simular es ajustarlo con JavaScript y el evento onresize.
No con el ancho en sí.
Tiene que establecer los márgenes y/o los saltos a la izquierda y a la derecha hasta un total de 50px.
Lo siento, no es lo que estoy buscando. El relleno hace que la página muestre barras de desplazamiento, algo que trato de evitar en primer lugar. Por favor, vea información adicional en la actualización de la pregunta. – thedp
Si desea que esta para toda la página:
body { margin: 0; padding: 25px; }
que le dará un acolchado en la parte superior y la parte inferior también. Si no desea que se puede establecer a cero:
body { margin: 0; padding: 0 25px; }
Nota: La mayoría de los navegadores utilizan un margen predeterminado para el cuerpo, pero algunos (Opera) utilizar un relleno por defecto en su lugar, lo que siempre debe especificar tanto el margen y el relleno para el cuerpo.
Lo siento, no es lo que estoy buscando. El relleno hace que la página muestre barras de desplazamiento, algo que trato de evitar en primer lugar. Por favor, vea información adicional en la actualización de la pregunta. – thedp
¿Barras de desplazamiento? Entonces, ¿tienes algunos divs posicionados absolutos? Realmente necesita publicar un SSCCE (http://sscce.org). – BalusC
Hay una solución en css3, y también creo que ha sido soportada en IE por algún tiempo.
Ejemplo:
width: -moz-calc(25% - 1em);
En el segundo div establece
top=50px,
bottom=0
position=absolute
No javascript necesario.
jquery puede ayudar – GibboK
@patricjansson tiene la solución correcta ... 'ancho: -webkit-calc (100% - 50px);' 'ancho: -o-calc (100% - 50px);' 'ancho: -moz- calc (100% - 50px); '' width: calc (100% - 50px); 'con un javaScript fallback. – user1752759