Width 100% en IE

[salbatore]

Hola, foreros:

Tengo un div que tiene un texto dentro y un div con width 100%. En safari y firefox la anchura del div que tiene width 100% se ajusta a la anchura que tiene el texto, en cambio la anchura en Internet Explorer 6 ocupa todo lo posible.

¿Como puedo hacer que la anchura del div llamado 'rayita' mida lo mismo que el texto 'Este es el texto'?

Código HTML:

<div style="float:left; background:#99FF33; margin-bottom:4px; margin-top:4px">
	<div id='rayita' style=" width:100%; float:left; background:#660099;overflow: hidden; height:4px; "></div>
	Este es el texto
</div> 

¿Se puede

[Mikmoro]

mmm... ¿no es más sencillo hacerlo así?

<div style="float:left; background:#99FF33; margin-bottom:4px; margin-top:4px; border-top:4px solid #660099;">Este es el texto</div>

[salbatore]

Hola, Mikmoro!

Ya habia pensado hacerlo de ese modo, pero necesito que esos 4px de altura tengan una imagen de fondo y como creo que es imposible dotar de fondo a un border top y a un border bottom diferentes debo hacerlo con divs, jeje.

¿Se te ocurre algo?, mago del css.

[Exonico]

Porque no le das el ancho y el alto del contenedor manualmente:

Ej:

Width: 50px;
height: 100px;

O en este caso para que te quede la altura que deseas dejale unicamente el

height: 4px;

[salbatore]

Hola...

Aparte de que no es nada elegante... el texto que hay en su interior es dinamico, aparte de que si aumenta su tamaño este no quedaria bien...

¿Sabeis que puedo hacer?

[Mikmoro]

Iniciado por salbatore

necesito que esos 4px de altura tengan una imagen de fondo

Creo que en ese caso lo lógico sería hacer la imagen de 4px y colocarla como fondo del div, posicionada a la izquerda y arriba.

http://www.araudi.net/forosdelweb/raya.html

[salbatore]

Hola, Mikmoro,

Eso queria hacer... pero necesito que tambien tenga un fondo en bottom, es decir, debajo del texto.

Este fondo debe ser diferente al del top, ya que deseo que si se aumenta el tamaño del texto los fondos se desplacen.

¿Sabes como puedo hacerlo?, es decir quiero hacer esto:

Código HTML:

<div>
	<div> fondo parte de arriba</div>
	Este es el texto
	<div> fondo parte de abajo</div>
</div> 

[Mikmoro]

¿Y si explicas todo de una sola vez para ver si hay solución?

[salbatore]

Hola, Mikmoro...

Ya lo siento... simplifique demasido mi problema para que pareciese mas simple... jeje... pero lo simplifique demado...

[Mikmoro]

Podrías poner otra caja dentro con el fondo que sea pero esta vez como bottom:

http://www.araudi.net/forosdelweb/raya2.html

[salbatore]

Hola, Mikmoro,

Como siempre... muchisimas gracias... mira que programo en varios lenguajes y no hay forma de llevarme bien con css... me vuelve loco.

Bueno. Gracias.

[Mikmoro]

Pues nada, es como los lenguajes de programación: echarle un poco de imaginación y las cosas van saliendo. Igual es porque es mucho más simple que cualquiera de ellos.

Saludos.