pantalla div dinamico contenido completa automatico ancho altura alto ajustar html css

html - dinamico - div sin contenido



Cómo hacer que un padre div tamaño automático al ancho de sus divs hijos (2)

El div principal (supongo que el div más externo) es display: block y rellenará toda el área disponible de su contenedor (en este caso, el cuerpo) que pueda. Use un tipo de pantalla diferente - en inline-block es probablemente lo que está buscando:

http://jsfiddle.net/a78xy/

Estoy tratando de hacer que el padre div solo sea tan ancho como el div infantil. El ancho automático hace que el div principal se ajuste a toda la pantalla. Los divs para niños tendrán diferentes anchuras dependiendo de su contenido, por lo que necesito el div principal para ajustarlo en consecuencia.

<div style=''width:auto;''> <div style="width: 135px; float: left;"> <h4 style="padding-right: 5px; padding-left: 15px;">Column1</h4> <dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;"> <dd style="white-space: nowrap;">1</dd> <dd style="white-space: nowrap;">2</dd> </dl> <h4 style="padding-right: 5px; padding-left: 15px;">Column1</h4> <dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;"> <dd style="white-space: nowrap;">1</dd> <dd style="white-space: nowrap;">2</dd> </dl> </div> <div style="width: 135px; float: right;"> <h4 style="padding-right: 5px; padding-left: 10px;">Column2</h4> <dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;"> <dd style="white-space: nowrap;">1</dd> <dd style="white-space: nowrap;">2</dd> <dd style="white-space: nowrap;">3</dd> </dl> </div> </div>


Sus elementos interiores <div> probablemente deberían estar float:left . Divs tamaño hasta 100% del tamaño de su ancho de contenedor de forma automática. Intenta usar display:inline-block lugar de width:auto en el contenedor div. O posiblemente float:left el contenedor y también aplica el overflow:auto . Depende de lo que busques exactamente.