Foros del Web » Creando para Internet » CSS »

Alinear 4 capas

Estas en el tema de Alinear 4 capas en el foro de CSS en Foros del Web. tengo 4 capas, de momento estoy intentando poner una al lado de la otra, tengo lo sigueinte HTML <div id="min_01"></div> <div id="min_02"></div> CSS #min_01{ background-image:url(../imgs/min_01.jpg); ...
  #1 (permalink)  
Antiguo 25/03/2011, 09:32
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Alinear 4 capas

tengo 4 capas, de momento estoy intentando poner una al lado de la otra, tengo lo sigueinte

HTML
<div id="min_01"></div>
<div id="min_02"></div>

CSS
#min_01{
background-image:url(../imgs/min_01.jpg);
width:51px;
height:51px;
margin-top:315px;
margin-left:410px;
}

#min_02{
background-image:url(../imgs/min_02.png);
width:51px;
height:51px;
margin-top:315px;
margin-left:470px;
}


con esto que tengo, la segunda la baja mucho, y no la deja al lado de la anterior
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #2 (permalink)  
Antiguo 25/03/2011, 09:41
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 9 años, 5 meses
Puntos: 1010
Respuesta: Alinear 4 capas

usa la propiedad float: right/left
  #3 (permalink)  
Antiguo 25/03/2011, 09:53
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

la he usado y no me va tampoco

soy novato en css, y la verdad q hasta ahora es con el primerproblema que me encuentro, como debería meterlo?
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #4 (permalink)  
Antiguo 25/03/2011, 10:14
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Bueno, comencemos por lo básico y puntos de consideración.

Para que una caja se posicione a la derecha de otra, necesitas ponerle la propiedad float:left;, tanto a la primera caja como a la segunda.
Posibles problemas:
Si la caja se ba para abajo, puede ser porque no tiene el suficiente espacio para acomodarse al lado de la otra, ya sea porque ambas estan contenidas en otro DIV con un ancho menor al que ocupas, o bien por el ancho de la pagina.
Tu codigo le aplica a cada caja un margin-left:470px; , por lo que sumado con los 410px que le aplicas a la otra y , tomando los 102px de ancho de las cajas (51px + 51px), suman un total de 982px que deberias tener disponibles de ancho en la linea de las cajas, solamente para que se pongan en la misma fila.

toma eso en consederación y nos avisas.

Saludos,
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #5 (permalink)  
Antiguo 25/03/2011, 10:21
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

gracias, es loq q tiene ser novato, no había tomado eso en cuenta

#min_01{
background-image:url(../imgs/min_01.jpg);
width:51px;
height:51px;
float:left;
margin-left:410px;
margin-top:-64px;
}

#min_02{
background-image:url(../imgs/min_02.png);
width:51px;
height:51px;
float:left;
margin-top:-64px;
margin-left:5px;
}


ahora va genial lo q no entiendo, es ahora lo de el margin top, he de ponerlo negativo, para q entre dentro del div contenedor
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #6 (permalink)  
Antiguo 25/03/2011, 10:26
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Si las cajas se estan saliendo del div contenedor, es porque algo esta mal puesto. Las cajas deberían acomodarse solas en su respectivo sitio.

Si requieres mas ayuda, vas a tener que poner más información (entiendase código) para poder analizarlo.
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #7 (permalink)  
Antiguo 25/03/2011, 10:34
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

otra cosa, no sé pq en dreamweaver se ve todo encajado en su sitioo, pero en firefox se descuadra todo, os dejo el codigo

HTML
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<link href="css/pasek.css" rel="stylesheet" type="text/css"> 

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
</head>

<body>


<div id="contenedor">

	<div id="cabecera">
    	<div id="logo"></div>
        <div id="idiomas"></div>
    </div>
    
    <div id="menu">Menu</div>
    
    <div id="sliders">Sliders</div>
    
    <div id="menu_izquierda">MEnu Izquierda</div>
    
    <div id="contenido">
    	<div id="imagen_fondo">
       	  <div id="texto_fondo">
       	  <div id="titulo_caja">Algo sobre nosotros</div>
                <div id="texto_caja">
                  <p>Texto.</p>
                  <p>Texto.</p>
              </div>
          </div>
        </div>
        <div id="min_01"></div>
        <div id="min_02"></div>
        <div id="min_03"></div>
        <div id="min_04"></div>
        <div id="min_05"></div>
    </div>
    
</div>


</body>
</html>




CSS
Código:
@charset "UTF-8";
/* CSS Document */

#contenedor{
	width:975px;
	height:691px;
	background-color:#000;
}

/*CABECERA*/

#cabecera{
	width:975px;
	height:107px;
	clear:both;
	background-color:#FFF;
	padding-left:75px;
}

#logo{
	width:217px;
	height:98px;
	padding-top:5px;
	background-image:url(../imgs/logo_principal.jpg);
	background-repeat:no-repeat;
	float:left;
}

#idiomas{
	width:45px;
	height:12px;
	float:right;
	background-image:url(../imgs/idiomas_es_ing.jpg);
	background-repeat:no-repeat;
	padding-right:77px;
}

/*FIN DE CABECERA*/

#menu{
	clear:both;
	width:975px;
	height:50px;
	background-color:#FFF;
}

#sliders{
	width:975px;
	height:162px;
	clear:both;
	background-color:#FFF;
}

#menu_izquierda{
	width:289px;
	height:372px;
	float:left;
	background-color:#FFF;
}


/*CONTENIDO*/

#contenido{
	float:left;
	width:686px;
	height:372px;
	background-color:#FFF;
}

#imagen_fondo{
	background-image:url(../imgs/fondo_c_index.jpg);
	background-repeat:no-repeat;
	width:668px;
	height:297px;
	margin-top:10px;
	margin-left:10px;
	float:left;
}

#texto_fondo{
	background-image:url(../imgs/texto_c_index.png);
	background-repeat:no-repeat;
	width:390px;
	height:148px;
	float:left;
	margin-top:210px;
	}

#titulo_caja{
	float:left;
	width:390px;
	height:30px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:16px;
	color:#FFF;
	padding-top:5px;
	padding-left:35px;
}

#texto_caja{
	width:390px;
	height:118px;
	font-family:"Trebuchet MS", Arial, tHelvetica, sans-serif;
	font-size:11px;
	color:#FFF;
	padding-left:3px;
}

#min_01{
	background-image:url(../imgs/min_01.jpg);
	width:51px;
	height:51px;
	float:left;
	margin-left:405px;
	margin-top:-64px;
}

#min_02{
	background-image:url(../imgs/min_02.png);
	width:51px;
	height:51px;
	float:left;	
	margin-top:-64px;
	margin-left:5px;
}

#min_03{
	background-image:url(../imgs/min_02.png);
	width:51px;
	height:51px;
	float:left;	
	margin-top:-64px;
	margin-left:5px;
}

#min_04{
	background-image:url(../imgs/min_02.png);
	width:51px;
	height:51px;
	float:left;	
	margin-top:-64px;
	margin-left:5px;
}

#min_05{
	background-image:url(../imgs/min_02.png);
	width:51px;
	height:51px;
	float:left;	
	margin-top:-64px;
	margin-left:5px;
}

/*FIN DE CONTENiDO*/
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #8 (permalink)  
Antiguo 25/03/2011, 10:40
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Suponiendo que todas las cajas de abajo estan flotadas (min_01,02...05), pon inmediatamente despues de ellas y antes del cierre del div contenedor esta linea:
Código CSS:
Ver original
  1. <div style="clear: both"></div>

Código HTML:
Ver original
  1. <div id="contenido">
  2.         <div id="imagen_fondo">
  3.           <div id="texto_fondo">
  4.           <div id="titulo_caja">Algo sobre nosotros</div>
  5.                 <div id="texto_caja">
  6.                   <p>Texto.</p>
  7.                   <p>Texto.</p>
  8.               </div>
  9.           </div>
  10.         </div>
  11.         <div id="min_01"></div>
  12.         <div id="min_02"></div>
  13.         <div id="min_03"></div>
  14.         <div id="min_04"></div>
  15.         <div id="min_05"></div>
  16. <div style="clear: both"></div>
  17.     </div>

Ya mas adelante verás que no es necesario usar tantos div para acomodar las cosas. Y lo digo básicamente por esto:
Código HTML:
Ver original
  1. <div id="texto_caja">
  2.                   <p>Texto.</p>
  3.                   <p>Texto.</p>
  4.               </div>
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #9 (permalink)  
Antiguo 25/03/2011, 10:44
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

sigue sin funcionar al añadir esa linea, salen descuadradas en firefox, en dreamweaer bien, pero en firefox no sale bien
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #10 (permalink)  
Antiguo 25/03/2011, 11:01
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Dos cosas:
1 - Acomoda la linea que carga tu css
Código HTML:
Ver original
  1. <link rel="stylesheet" type="text/css" href="css/pasek.css" media="screen" />

2 - Verifica que este bien la direccion y el nombre del css

Yo copié tu codigo aca y lo probé y todo se movió donde debe
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #11 (permalink)  
Antiguo 25/03/2011, 11:43
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

la url de la hoja de estilos está bien, y sigue haciendome lo mismo, como te comento en dreamweaver se alinea bien, pero en firefox no, puede ser que sea la versión de firefox 4?

mira, puedes verlo en http://manucastro.es/pasek/web/index.php
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #12 (permalink)  
Antiguo 25/03/2011, 12:20
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Lo que ocupas es algo así ???

__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #13 (permalink)  
Antiguo 25/03/2011, 12:30
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

eso es, exactamente
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #14 (permalink)  
Antiguo 25/03/2011, 12:37
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Código CSS:
Ver original
  1. /*CONTENIDO*/
  2.  
  3. #contenido{
  4.     position: relative;
  5.     width:695px;
  6.     border: solid 1px;
  7.     background-image:url(../imgs/fondo_c_index.jpg);
  8.     background-repeat:no-repeat;
  9.     background-position: 10px 10px;
  10.  
  11. }
  12.  
  13. #texto_caja{
  14.     width:390px;
  15.     height:118px;
  16.     font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
  17.     font-size:11px;
  18.     color:#000;
  19.     margin: 50px 0 0 5px;
  20.     border: solid 1px;
  21.     float: left;
  22. }
  23.  
  24. #min_01{
  25.     background-image:url(../imgs/min_01.jpg);
  26.     width:51px;
  27.     height:51px;
  28.     float:left;
  29.     margin: 15&#37; 5px 0 5px;
  30.     border: solid 1px;
  31. }
  32.  
  33. #min_02{
  34.     background-image:url(../imgs/min_02.png);
  35.     width:51px;
  36.     height:51px;
  37.     float:left;
  38.     margin-right:5px;
  39.     margin-top: 15%;
  40.     border: solid 1px;
  41. }
  42.  
  43. #min_03{
  44.     background-image:url(../imgs/min_02.png);
  45.     width:51px;
  46.     height:51px;
  47.     float:left;
  48.     margin-right:5px;
  49.     margin-top: 15%;
  50.     border: solid 1px;
  51. }
  52.  
  53. #min_04{
  54.     background-image:url(../imgs/min_02.png);
  55.     width:51px;
  56.     height:51px;
  57.     float:left;
  58.     margin-right:5px;
  59.     margin-top: 15%;
  60.     border: solid 1px;
  61. }
  62.  
  63. #min_05{
  64.     background-image:url(../imgs/min_02.png);
  65.     width:51px;
  66.     height:51px;
  67.     float:left;
  68.     margin-right:5px;
  69.     margin-top: 15%;
  70.     border: solid 1px;
  71. }
Código HTML:
Ver original
  1. <div id="contenido">caja-contenido
  2.         <div id="texto_caja">
  3.           <p>Algo sobre nosotros</p>
  4.                   <p>Texto.</p>
  5.                   <p>Texto.</p>
  6.         </div>
  7.         <div id="min_01">  
  8.                   <p>min_01.</p>
  9.                   <p>min_01.</p>
  10.         </div>
  11.         <div id="min_02">
  12.                   <p>min_02.</p>
  13.                   <p>min_02.</p>
  14.         </div>
  15.         <div id="min_03">
  16.                   <p>min_03.</p>
  17.                   <p>min_03.</p>
  18.         </div>
  19.         <div id="min_04">
  20.                   <p>min_04.</p>
  21.                   <p>min_04.</p>
  22.         </div>
  23.         <div id="min_05">
  24.                   <p>min_05.</p>
  25.                   <p>min_05.</p>
  26.         </div>
  27.     </div>
COMENTARIOS:

Como vas a ver, eliminé una caja que estaba metida ahi, la que trae el texto "Algo sobre nosotros" , ahi puedes ponerla con la imagen que ocupas o le agregar los datos al <p> que esta conteniendo el texto.
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #15 (permalink)  
Antiguo 25/03/2011, 12:37
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

los bordes de 1px quitalos, yo los puese para poder ver los div.

Esa linea que dice 15&#37 es 15% , el codigo de aqui lo edito así
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #16 (permalink)  
Antiguo 25/03/2011, 13:07
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

nada, tampoco sale bien
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #17 (permalink)  
Antiguo 25/03/2011, 13:19
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Pues no se que decirte entonces

__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #18 (permalink)  
Antiguo 25/03/2011, 13:46
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

en que navegador lo miras?, pq a mi sigue sin irme
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #19 (permalink)  
Antiguo 25/03/2011, 13:54
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

IE8. Pero si lo estas actualizando aqui http://manucastro.es/pasek/web/index.php ,
yo no veo ningun cambio
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #20 (permalink)  
Antiguo 25/03/2011, 13:59
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

lo probé y nada por eso volví a las version anterior
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #21 (permalink)  
Antiguo 25/03/2011, 15:11
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Pues a mi si me funciona, algo debes haber puesto diferente. Copiate todo esto en un notepad y salvalo como html y lo pruebas

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.  
  4.  
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6.  
  7. <style type="text/css">
  8. /*CABECERA*/
  9.  
  10. #cabecera{
  11.     width:975px;
  12.     height:107px;
  13.     clear:both;
  14.     background-color:#FFF;
  15.     padding-left:75px;
  16. }
  17.  
  18. #logo{
  19.     width:217px;
  20.     height:98px;
  21.     padding-top:5px;
  22.     background-image:url(../imgs/logo_principal.jpg);
  23.     background-repeat:no-repeat;
  24.     float:left;
  25. }
  26.  
  27. #idiomas{
  28.     width:45px;
  29.     height:12px;
  30.     float:right;
  31.     background-image:url(../imgs/idiomas_es_ing.jpg);
  32.     background-repeat:no-repeat;
  33.     padding-right:77px;
  34. }
  35.  
  36. /*FIN DE CABECERA*/
  37.  
  38. #menu{
  39.     clear:both;
  40.     width:975px;
  41.     height:50px;
  42.     background-color:#FFF;
  43. }
  44.  
  45. #sliders{
  46.     width:975px;
  47.     height:162px;
  48.     clear:both;
  49.     background-color:#FFF;
  50. }
  51.  
  52. #menu_izquierda{
  53.     width:289px;
  54.     height:372px;
  55.     float:left;
  56.     background-color:#FFF;
  57. }
  58.  
  59. /*CONTENIDO*/
  60.  
  61. #contenido{
  62.     position: relative;
  63.     width:695px;
  64.     height: 310px;
  65.     border: solid 1px;
  66.     background-image:url(fondo_c_index.jpg);
  67.     background-repeat:no-repeat;
  68.     background-position: 10px 10px;
  69.  
  70. }
  71.  
  72. #texto_caja{
  73.     width:368px;
  74.     height:155;
  75.     font: 12px  "Trebuchet MS", Arial, Helvetica, sans-serif;
  76.     color: #ffffff;
  77.     background-color: blue;
  78.     margin: 19% 0 0 11px;
  79.     border: solid 1px;
  80.     float: left;
  81. }
  82.  
  83. #min_01{
  84.     background-image:url(min_01.jpg);
  85.     width:52px;
  86.     height: 50px;
  87.     float:left;
  88.     margin: 30% 5px 0 5px;
  89.     border: solid 1px;
  90. }
  91.  
  92. #min_02{
  93.     background-image:url(min_02.png);
  94.     width:52px;
  95.         height: 50px;
  96.     float:left;
  97.     margin-right:5px;
  98.     margin-top: 30%;
  99.     border: solid 1px;
  100. }
  101.  
  102. #min_03{
  103.     background-image:url(min_01.jpg);
  104.     width:52px;
  105.         height: 50px;
  106.     float:left;
  107.     margin-right:5px;
  108.     margin-top: 30%;
  109.     border: solid 1px;
  110. }
  111.  
  112. #min_04{
  113.     background-image:url(min_02.png);
  114.     width:52px;
  115.         height: 50px;
  116.     float:left;
  117.     margin-right:5px;
  118.     margin-top: 30%;
  119.     border: solid 1px;
  120. }
  121.  
  122. #min_05{
  123.     background-image:url(min_01.jpg);
  124.     width:52px;
  125.         height: 50px;
  126.     float:left;
  127.     margin-right:5px;
  128.     margin-top: 30%;
  129.     border: solid 1px;
  130.  
  131. }
  132. <div style="clear: both"></div>
  133. </head>
  134.  
  135. <div id="contenedor">
  136.  
  137.     <div id="cabecera">
  138.         <div id="logo"></div>
  139.         <div id="idiomas"></div>
  140.     </div>
  141.    
  142.     <div id="menu">Menu</div>
  143.    
  144.     <div id="sliders">Sliders</div>
  145.    
  146.     <div id="menu_izquierda">MEnu Izquierda</div>
  147.  
  148.     <div id="contenido">
  149.         <div id="texto_caja">
  150.           <p style="background-color:#191970; line-height: 25px;"> Algo sobre nosotros</p>
  151.                   <p >El espíritu de eficiencia, principio vital de Pasek, concilia la evolución técnica y los impreativos económicos con las necesidades técnicas de nuestros clientes<br />
  152.                        Nuestra Actividad plurisectorial dedicada a diseñar, fabricar y aplicar una completa gama de tecnologías de instalación y de productos refractarios de alta calidad, nos confiere la máxima flexibilidad en las necesidades del sector industrial.</p>
  153.         </div>
  154.         <div id="min_01"></div>
  155.         <div id="min_02"></div>
  156.         <div id="min_03"></div>
  157.         <div id="min_04"></div>
  158.         <div id="min_05"></div>
  159.    </div>
  160. </div>
  161. </body>
  162. </html>

el css va en la misma hoja
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #22 (permalink)  
Antiguo 26/03/2011, 08:36
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

puedo meter el css en una hoja aparte?

por cierto, tendrá q ver q guarde como php en vez de html?

he subido lo que me has pasado y mira

http://manucastro.es/pasek/web2/prueba.html
__________________
diseño y programación
http://www.manucastro.es
[email protected]

Última edición por Sette; 26/03/2011 a las 08:56
  #23 (permalink)  
Antiguo 28/03/2011, 08:57
Avatar de gVenom  
Fecha de Ingreso: julio-2008
Ubicación: Costa Rica
Mensajes: 1.455
Antigüedad: 9 años, 5 meses
Puntos: 53
Respuesta: Alinear 4 capas

Los estilos pueden ir aparte. Yo los puse ahi por facilidad en la prueba.

PHP o Html, es indiferente. Los estilos van aplicados a los objetos.

El link no me cargo nada.
__________________
"Al que venciere y guardare mis obras hasta el fin, yo le daré autoridad sobre las naciones."
Apocalipsis 2: 26
Servicios para Pymes http://dst.co.cr
  #24 (permalink)  
Antiguo 28/03/2011, 09:08
Avatar de Sette  
Fecha de Ingreso: febrero-2002
Mensajes: 1.746
Antigüedad: 15 años, 10 meses
Puntos: 3
Respuesta: Alinear 4 capas

lo he conseguido, simplemente era quitar el margin-top

no te preocupes que me verás ahora que estoy intentando aprender css más por este subforo
__________________
diseño y programación
http://www.manucastro.es
[email protected]
  #25 (permalink)  
Antiguo 02/04/2011, 03:25
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Alinear 4 capas

Hola:

Cita:
Iniciado por gVenom Ver Mensaje
PHP o Html, es indiferente.
Siempre que el servidor donde se aloje la página admita php, de lo contrario no es indiferente.

Saludos.


Etiquetas: alinear, capas
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 10:29.