Foros del Web » Creando para Internet » CSS »

duda de maquetacion con css

Estas en el tema de duda de maquetacion con css en el foro de CSS en Foros del Web. hola :) tengo una celda de 400 pixeles de ancho y 278 de alto en esta quiero poner a la izquierda un texto alineado a ...
  #1 (permalink)  
Antiguo 18/06/2009, 13:35
 
Fecha de Ingreso: mayo-2009
Ubicación: Andalucia
Mensajes: 650
Antigüedad: 8 años, 7 meses
Puntos: 1
Busqueda duda de maquetacion con css

hola :)

tengo una celda de 400 pixeles de ancho y 278 de alto

en esta quiero poner a la izquierda un texto alineado a la izquierda.

seria asi un encabezado h5 y justo abajo de este un parrafo.

<h5>
<p>

y a la derecha a la mitad de la altura de la celda quiero colocar una imagen pequeña.
lo que la maquetacion quedaria asi

<h5>
</h5>
<p>
....
... <img>
....
</p>

este es el codigo que e usado pero no consigo hacer esto como yo quiero. con el codigo ke voy a poner me salen el encabezado y el parrafo como si estuvieran en dos columnas paralelas y a la derecha eso si la imagen pero colocado en la esquina superior derecha y yo la quiero a la mitad de la celda.

esto es lo que me sale en el firefox con los codigos que e puesto a continuacion.

<img>
<h5></h5> <p></p>


que tengo que modificar en el css???


codigo:

html:

Código:
 <div id="celdatextoazul">	<img src="imagenes/logazo copia.gif" width="180" height="66" />
 <h5>Nosotros</h5>
 
 <p>&nbsp;</p>
 <p>&nbsp;</p>
 <p>MUDANZAS 2000 S.L
es un grupo líder a nivel nacional en transportes, mudanzas y guardamuebles, desde 1947 a su servicio.
Ver más información</p>
 </div>
css:
Código:
#celdatextoazul{
width:400px;
height:278px;
float:left;
background-color:#9999CC;
overflow: auto;
position: relative;

}

#celdatextoazul img{
float: right;
list-style-image:url(imagenes/logazo copia.gif)
}
	
	#celdatextoazul p {
	float: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#000000;
	}
	
#celdatextoazul h5 {
	float: left;
	font-family: "Times New Roman", Times, serif;
	font-size: 16px;
	color:#CCCCCC;
	}
  #2 (permalink)  
Antiguo 18/06/2009, 14:04
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: duda de maquetacion con css

Pruebalo de esta manera:

Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>Untitled Document</title>
  5. <style type="text/css">
  6. #celdatextoazul{
  7. width:400px;
  8. height:278px;
  9. text-align:left;
  10. background-color:#9999CC;
  11. display:table;
  12. }
  13.  
  14. #celdatextoazul img{
  15. float: right;
  16. display:block;
  17. margin:5px;
  18. /*list-style-image:url(imagenes/logazo copia.gif) -- Esto no entiendo que hace aquí*/
  19. }
  20. #celdatextoazul p {
  21. font-family: Verdana, Arial, Helvetica, sans-serif;
  22. font-size: 12px;
  23. color:#000000;
  24. display:block;
  25. padding:10px;
  26. clear:both;
  27. }
  28.    
  29. #celdatextoazul h5 {
  30.     font-family: "Times New Roman", Times, serif;
  31.     font-size: 16px;
  32.     color:#CCCCCC;
  33.     padding:10px 2px;
  34.     overflow:hidden;
  35. }
  36. </head>
  37.  
  38. <div id="celdatextoazul">
  39.     <img src="imagenes/logazo copia.gif" width="180" height="66" />
  40.     <h5>Nosotros</h5>
  41.     <p>MUDANZAS 2000 S.L
  42.     es un grupo líder a nivel nacional en transportes, mudanzas y guardamuebles, desde 1947 a su servicio.
  43.     Ver más información</p>
  44. </div>
  45. </body>
  46. </html>
__________________
WFC
codigo82
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 07:42.