Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] [Ayuda] Poner un menu con css al lado de el contenido

Estas en el tema de [Ayuda] Poner un menu con css al lado de el contenido en el foro de CSS en Foros del Web. Hola,yo queria poner un menu al lado izquierdo del contenido,vi en webs que se hacia,pero yo no he hecho muchos css,estos son mis codigos: Css: ...
  #1 (permalink)  
Antiguo 13/02/2011, 14:44
 
Fecha de Ingreso: diciembre-2010
Mensajes: 28
Antigüedad: 7 años
Puntos: 0
[Ayuda] Poner un menu con css al lado de el contenido

Hola,yo queria poner un menu al lado izquierdo del contenido,vi en webs que se hacia,pero yo no he hecho muchos css,estos son mis codigos:

Css:
Código HTML:
body
{
background-image:url(../layout/fondo-admin-final.png);
background-repeat:repeat;
}
#page {
	margin:100px auto 0 auto;
	background:url(../layout/contenido.png);
	width:890px;
	height:635px;
}
#page #content {
	padding:25px 30px 0 30px;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
}
#menu {
	float:left;
	margin:10px auto 0 auto;
	background:url(../layout/menu.png);
	width:10px;
	height:200px;
	margin-left: 0px;
	margin-top: 500px;
}
Pagina:

Código HTML:
<link href="admin-css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="page"> 
<div id="content">
  <div id="main">  
    <h1>¡Bienvenido! a Sitio</h1>
        <p>¡Bienvenido al nuevo panel de Sitio!Un nuevo diseño más acojedor y más funciones.Como podra obeservar la BETA de Sitio ya termino.Si encuentra algun fallo reportalo en la sección de Sitio &gt; Contaco en elmenu horizontal de arriba.</p>
<p>Sitio</p>
        <p><span class="left">
          
        
</span>
        </p>
<p></p>&nbsp;</p>
      </div>
  </div>
</div>  
</div><div id="menu" align="left">Menu</div> 
Imagen de mi idea:
http://img651.imageshack.us/i/sinttulomej.png/
  #2 (permalink)  
Antiguo 13/02/2011, 15:32
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: [Ayuda] Poner un menu con css al lado de el contenido

Pues te faltó muy poco.
Te marco con comentarios los cambios.
Código CSS:
Ver original
  1. body
  2. {
  3. background-image:url(../layout/fondo-admin-final.png);
  4. background-repeat:repeat;
  5. }
  6. #page {
  7.     margin:100px auto 0 auto;
  8.     background:url(../layout/contenido.png);
  9.     width:890px;
  10.     height:635px;
  11.     float:left; /* Este es uno de los cambios */
  12. }
  13. #page #content {
  14.     padding:25px 30px 0 30px;
  15.     text-align: left;
  16.     font-family: Arial, Helvetica, sans-serif;
  17. }
  18. #menu {
  19.     float:left;
  20.     margin:10px auto 0 auto;
  21.     background:url(../layout/menu.png);
  22.     width:10px;
  23.     height:200px;
  24.     margin-left: 0px;
  25.     margin-top: 500px;
  26. }

Código HTML:
Ver original
  1. <link href="admin-css.css" rel="stylesheet" type="text/css" />
  2. </head>
  3. <!-- ESTE ES OTRO DE LOS CAMBIOS -->
  4. <div id="menu" >Menu</div>[/B]
  5. <!--    ................................  -->
  6. <div id="page">
  7. <div id="content">
  8.   <div id="main">  
  9.     <h1>¡Bienvenido! a Sitio</h1>
  10.         <p>¡Bienvenido al nuevo panel de Sitio!Un nuevo diseño más acojedor y más funciones.Como podra obeservar la BETA de Sitio ya termino.Si encuentra algun fallo reportalo en la sección de Sitio &gt; Contaco en elmenu horizontal de arriba.</p>
  11. <p>Sitio</p>
  12.         <p><span class="left">
  13.          
  14.        
  15. </span>
  16.         </p>
  17. <p></p>&nbsp;</p>
  18.       </div>
  19.   </div>
  20. </div>  
  21. </div>

No lo he probado, pero supongo que funcionará.

Última edición por sanxuan; 13/02/2011 a las 15:37
  #3 (permalink)  
Antiguo 14/02/2011, 11:16
 
Fecha de Ingreso: diciembre-2010
Mensajes: 28
Antigüedad: 7 años
Puntos: 0
Respuesta: [Ayuda] Poner un menu con css al lado de el contenido

Gracias,me funciono...
Ahora una pregunta que no viene al tema:
¿Como centar el div?
Yo tengo un div creditos,quiero centrarlo en el centro de la pantalla,como seria?
(se que es una pregunta de novatos,pero esque no me sale)

Codigo:
Código HTML:
#creditos {
	float:left;
	background:url(../layout/creditos.png);
	width:615px;
	height:50px;
	background-position: center;
}
Gracias a todos,por ayudarme a terminar mi script :D
  #4 (permalink)  
Antiguo 14/02/2011, 11:42
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: [Ayuda] Poner un menu con css al lado de el contenido

Hola:

Para el centrado horizontal utiliza:

Código CSS:
Ver original
  1. margin:0 auto;

para el centrado vertical: centrado vertical css

Saludos.


Etiquetas: contenido, lado, poner
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 02:59.