Foros del Web » Programando para Internet » Javascript »

Ajustar el height de un div de acuerdo al ancho

Estas en el tema de Ajustar el height de un div de acuerdo al ancho en el foro de Javascript en Foros del Web. Tengo el siguiente problema, en el div tengo una imagen de fondo, esa imagen de fondo es de 1800x500, con el css "background-size:100% 100%" hago ...
  #1 (permalink)  
Antiguo 25/10/2016, 17:20
 
Fecha de Ingreso: junio-2015
Mensajes: 6
Antigüedad: 8 años, 9 meses
Puntos: 0
Ajustar el height de un div de acuerdo al ancho

Tengo el siguiente problema, en el div tengo una imagen de fondo, esa imagen de fondo es de 1800x500, con el css "background-size:100% 100%" hago que se ajuste al tamaño del div, estoy trabajando con freemarker, pero el contenido es html, por alguna extraña razón en los estilos del div no puedo poner porcentajes a los div, ni letras, exclusivamente el numero de pixeles, encontre un codigo que va ajustando el ancho del div de acuerdo al tamaño de la pantalla, pero no sucede lo mismo con el alto (height), esperaba que con estilos se pudiera que el alto del div tambien fuese cambiando, alguna idea?


este es mi codigo:
<div id="knoell-carousel-${randomNamespace}" style="width:1px; margin-left: auto; margin-right: auto; background-size:100% 100%;background-repeat: no-repeat;">
<#list images.getSiblings() as cur_images>

<#if cur_images.imagelink.getData() != "">
<a href="${cur_images.imagelink.getData()}">
</#if>
<#if cur_images.imagelink.getData() == "">
<a href="${cur_images.imagelink2.getData()}">
</#if>

<div class="carousel-item" style="background: url(${cur_images.getData()});background-size:100% 100%; width:1px; height:600px; background-repeat: no-repeat;">
</div>
</a>

</#list>
</div>
  #2 (permalink)  
Antiguo 26/10/2016, 15:03
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 9.028
Antigüedad: 21 años, 1 mes
Puntos: 1826
Respuesta: Ajustar el height de un div de acuerdo al ancho

Ni idea que haga el freemaker. Pero la idea básica es que el alto tendría que ser calculando tu ancho con JavaScript y luego ese dato enviarlo otra vez como altura, tal vez haciendo una operación de porcentaje.

Una opción rústica es que pongas un objeto transparente, una imagen arriba.

Vamos a mover el tema a JavaScript.

Etiquetas: css, height, html, responsive
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 14:14.