Foros del Web » Creando para Internet » CSS »

problema con estilos (menuda novedad!)

Estas en el tema de problema con estilos (menuda novedad!) en el foro de CSS en Foros del Web. Hola, buenas. Este es mi primer post en este foro y me gustaria saludar a toda la comunidad antes de expresar mis dudas. Hola a ...
  #1 (permalink)  
Antiguo 05/06/2010, 22:11
 
Fecha de Ingreso: junio-2010
Mensajes: 26
Antigüedad: 7 años, 6 meses
Puntos: 3
Pregunta problema con estilos (menuda novedad!)

Hola, buenas. Este es mi primer post en este foro y me gustaria saludar a toda la comunidad antes de expresar mis dudas. Hola a todos

No soy de forear mucho pero siempre que tengo alguna duda y busco en google la respuesta acaba viniendo entre otras webs de esta. Ahora tengo una duda que la verdad no se como expresar ni como empezar a buscar por lo que estoy en la obligacion de postearla para ver si alguien sabe resolvermela.

Estoy empezando a hacer una pagina web y tengo el index y los estilos. El problema viene al insertar un span.

Tengo 3 estilos que forman un rectangulo:

-El estilo de arriba tiene una imagen de fondo que es la parte de arriba del rectangulo.

-El estilo del medio es un estilo con height:auto con una imagen de un pixel que se repite.

-Y el estilo de abajo es igual que el de arriba pero con la imagen de fondo de la parte de abajo del rectangulo.

Bueno, si en el estilo del medio inserto texto el rectangulo aumenta de tamaño sin problemas y cuanto mas texto meto mas se agranda pero el problema es si en vez de meter texto a palo seco inserto un span.

Si inserto el span con texto el texto no forma parte del contenido del estilo central y se superpone la imagen del estilo de abajo.

Pongo aqui el codigo para que lo entendais mejor:
Código:
		<div id="contenedor_contenido">
			<div id="contenedor_noticia">
				<div id="c_barr"></div>
				<div id="c_bcen">
					<span class="titulo">Hola</span>
				</div>
				<div id="c_babj"></div>

			</div>
		</div>
Estilos:
Código:
#c_barr{
	position:relative;
	width:656px;
	height:20px;
	float:left;
	background-image:url(../img/c_barr.png);
	background-repeat:no-repeat;
	}

#c_bcen{
	position:relative;
	width:656px;
	height:auto;
	float:left;
	background-image:url(../img/c_bcen.png);
	background-repeat:repeat;
	}

#c_babj{
	position:relative;
	width:656px;
	height:20px;
	float:left;
	clear:left;
	background-image:url(../img/c_babj.png);
	background-repeat:no-repeat;
	}

.titulo{
	position:absolute;
	margin-left:14px;
	font-family:Arial;
	font-size:30px;
	color:#E11534;
	font-weight:bold;
	}
Si escribo solo hola sin el span no hay problema. El estilo del centro aunmenta su tamaño:

Código:
		<div id="contenedor_contenido">
			<div id="contenedor_noticia">
				<div id="c_barr"></div>
				<div id="c_bcen">
					Hola
				</div>
				<div id="c_babj"></div>

			</div>
		</div>
No se si tendra que ver con clrea y float pero la verdad es que no se como meter el span dentro del estilo central y que a su vez el estilo central agrande su altura y el estilo de abajo no se superponga.

Espero haberme expresado bien. Gracias por vuestra atencion :P

Saludos.

Última edición por higochumbo; 05/06/2010 a las 22:49
  #2 (permalink)  
Antiguo 05/06/2010, 22:40
Avatar de pitufoweb  
Fecha de Ingreso: enero-2008
Ubicación: Un Mundo Raro
Mensajes: 1.148
Antigüedad: 9 años, 10 meses
Puntos: 181
Respuesta: problema con estilos (menuda novedad!)

mmmm,

sera porque no cerraste correctamente la etiqueta span.

Cita:
<span class="titulo">Hola</span
<span class="titulo">Hola</span>



Bye
  #3 (permalink)  
Antiguo 05/06/2010, 22:47
 
Fecha de Ingreso: junio-2010
Mensajes: 26
Antigüedad: 7 años, 6 meses
Puntos: 3
De acuerdo Respuesta: problema con estilos (menuda novedad!)

Madre mia xD

Muchas gracias pitufoweb. Siempre siempre siempre son los pu..os cierres o comas o llaves...

Saludos!
  #4 (permalink)  
Antiguo 05/06/2010, 22:49
 
Fecha de Ingreso: junio-2010
Mensajes: 26
Antigüedad: 7 años, 6 meses
Puntos: 3
Respuesta: problema con estilos (menuda novedad!)

Puesss, no es eso

El problema persiste.
  #5 (permalink)  
Antiguo 05/06/2010, 22:55
 
Fecha de Ingreso: junio-2010
Mensajes: 26
Antigüedad: 7 años, 6 meses
Puntos: 3
Respuesta: problema con estilos (menuda novedad!)

Por si ayuda visulizarlo, en el texto rojo pone firefox y esa palabra deberia salir dentro del rectangulo.

imagen:

  #6 (permalink)  
Antiguo 05/06/2010, 23:06
Avatar de pitufoweb  
Fecha de Ingreso: enero-2008
Ubicación: Un Mundo Raro
Mensajes: 1.148
Antigüedad: 9 años, 10 meses
Puntos: 181
Respuesta: problema con estilos (menuda novedad!)

Cita:
<span class="titulo">Hola</span>
Cita:
.titulo{
position:absolute;

Tienes el span con posición absoluta, lo cual lo hace que lo quite del flujo del documento.


Quita la posición absoluta y con eso solucionaras tu problema.





Bye.
  #7 (permalink)  
Antiguo 05/06/2010, 23:09
 
Fecha de Ingreso: junio-2010
Mensajes: 26
Antigüedad: 7 años, 6 meses
Puntos: 3
Respuesta: problema con estilos (menuda novedad!)

Ahora si, muchas gracias!

Etiquetas: estilos, novedad
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 15:24.