Foros del Web » Creando para Internet » CSS »

hacer cabecera

Estas en el tema de hacer cabecera en el foro de CSS en Foros del Web. Buenas a tod@s, Sigo con mis problemillas, Estoy haciendo la cabecera de mi web, q consta de un logotipo y un menú. Pues no sé ...
  #1 (permalink)  
Antiguo 23/03/2010, 07:25
 
Fecha de Ingreso: marzo-2010
Mensajes: 109
Antigüedad: 14 años, 1 mes
Puntos: 0
hacer cabecera

Buenas a tod@s,

Sigo con mis problemillas,

Estoy haciendo la cabecera de mi web, q consta de un logotipo y un menú. Pues no sé q pasa q no consigo colocarlo donde quiero, el logo sí, pero el menú no, o se me va al lateral, o arriba o encima del logo. Ahora mismo lo tengo encima del logo.
Envio código a ver:


html
<body>
<div id= "contenedor">

<div id= "cabecera">
<ol>
<li class="uno"><a href="#">INICIO</a></li>
<li class="dos"><a href="filmo.html">FILMOGRAFÍA</a></li>
<li class="tres"><a href="productora.html">PRODUCTORA</a></li>
<li class="cuatro"><a href="proyectos.html">PROYECTOS</a></li>
</ol>
</div>
<div id="contenido"></div>
<div id= "pie">
<ul>
<li><a href="blog.html">BLOG</a></li>
<li><a href="sproduccion.html">SERVICIOS DE PRODUCCIÓN</a></li>
<li><a href="cineonline.html">CINE ON LINE</a></li>
</ul>
</div>
</div>
</body>



css
body {

background:url(../imagenes/fondo2.jpg) no-repeat center;
position:static;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:15px;

}

a {
text-transform:uppercase;
text-decoration:none;
color:#666;
cursor:pointer;
}

a:hover {
color:#bcd306;
}



/* Estilos contenedor
-----------------------------------------------------------------*/
div#contenedor {
width:610px;
height:495px;
margin:20px auto 0 auto;
}


/* Estilos cabecera
-----------------------------------------------------------------*/

div#cabecera {
background:url(../imagenes/logo.jpg) no-repeat;
wight:614px;
height:120px;

}

div#cabecera ul {
float:left;
margin-left:110px;
}

div#cabecera ul li{
float:left;
}


agradecería ayuda, gracias
  #2 (permalink)  
Antiguo 23/03/2010, 07:49
 
Fecha de Ingreso: marzo-2009
Ubicación: Santo André - São Paulo - Brasil
Mensajes: 91
Antigüedad: 15 años
Puntos: 1
Respuesta: hacer cabecera

Tuyo HTML hace lo seguinte. Dentro de la DIV el pone el menu.
Para ayudar-lo haga una DIV para lo logo em cabecera. Y haga una outra DIV para lo menu.
__________________
Exitem 11 tipos de personas. Las personas que comprendem binario. Y las personas que no comprende.

Tudo en la vida és sencillo o muy sencillo.
  #3 (permalink)  
Antiguo 23/03/2010, 07:58
 
Fecha de Ingreso: marzo-2010
Mensajes: 109
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: hacer cabecera

vale, pero van a la misma altura. Entonces q hago, un float?
estoy perdidaaaaa
  #4 (permalink)  
Antiguo 23/03/2010, 08:36
 
Fecha de Ingreso: marzo-2009
Ubicación: Santo André - São Paulo - Brasil
Mensajes: 91
Antigüedad: 15 años
Puntos: 1
Respuesta: hacer cabecera

si un float.
__________________
Exitem 11 tipos de personas. Las personas que comprendem binario. Y las personas que no comprende.

Tudo en la vida és sencillo o muy sencillo.
  #5 (permalink)  
Antiguo 23/03/2010, 14:37
 
Fecha de Ingreso: marzo-2010
Mensajes: 109
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: hacer cabecera

ya lo he conseguido con float. El problema q tengo ahora q en un div está el logo y en el otro el menú en lista, pues bien ¿cómo lo puedo poner en linea? He provado display:inline y no me lo hace. HELP PLEASE.
Envio código de ese trozo:

HTML
div id="cabecera">
<div id="logo"><p><img src="imagenes/logo.jpg" width="116" height="115"></p></div>
<div id="menu">
<ul>
<li><a href="home.html" class="activo">INICIO</a></li>
<li><a href="filmo.html" class="inactivo">FILMOGRAFÍA</a></li>
<li><a href="productora.html" class="inactivo">PRODUCTORA</a></li>
<li><a href="proyectos.html" class="inactivo">PROYECTOS</a></li>
</ul>
</div>
</div>

CSS
/* Estilos cabecera
-----------------------------------------------------------------*/

div#logo {
wight:120px;
float:left;
}

div#menu {
float:left;
wight:457px;
height:120px;
margin:48px 0 0 50px;
}
  #6 (permalink)  
Antiguo 23/03/2010, 14:47
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años, 1 mes
Puntos: 1329
Respuesta: hacer cabecera

Poner en linea como?, Poner el logo y el menú uno a lado del otro solo el menú con cada enlace uno al lado del otro.

Saludos
__________________
Grupo Telegram Docker en Español
  #7 (permalink)  
Antiguo 23/03/2010, 15:19
 
Fecha de Ingreso: marzo-2010
Mensajes: 109
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: hacer cabecera

perdón, siempre me explico fatal jajaja. Ya aprenderé.

El logo y el menú ya lo tengo uno al lado del otro, lo que quiero q las cuatro palabras del menú me queden en linea, y de paso ya que pido, poder dominar el espacio entre ellas.

Gracias
  #8 (permalink)  
Antiguo 23/03/2010, 15:35
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años, 1 mes
Puntos: 1329
Respuesta: hacer cabecera

Con esto los pones cada enlace al lado y con espacio de 10px a la derecha e izquierda.

Código CSS:
Ver original
  1. #menu ul li {
  2. float: left;
  3. margin: 0px 10px;
  4. }

Saludos
__________________
Grupo Telegram Docker en Español
  #9 (permalink)  
Antiguo 23/03/2010, 15:49
 
Fecha de Ingreso: marzo-2010
Mensajes: 109
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: hacer cabecera

gracias carlangueitor, ya lo tengo en línea, pero necesito q se me separen más las cuatro palabras del listado, esto donde se define?
  #10 (permalink)  
Antiguo 23/03/2010, 15:55
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años, 1 mes
Puntos: 1329
Respuesta: hacer cabecera

En donde dice "margin: 0px 10px;" el 0 es el margen superior e inferior y el otro es el derecho e izquierdo.

Te recomiendo que empieces a leer algo de CSS para que puedas resolver tus problemas más fácilmente. www.librosweb.es

saludos
__________________
Grupo Telegram Docker en Español
  #11 (permalink)  
Antiguo 23/03/2010, 16:09
 
Fecha de Ingreso: marzo-2010
Mensajes: 109
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: hacer cabecera

ya se lo q son los margin, pero son los del div, yo quiero separar las palabras del listado, y con word-spacing no me funciona.
  #12 (permalink)  
Antiguo 23/03/2010, 16:11
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 16 años, 1 mes
Puntos: 1329
Respuesta: hacer cabecera

Probaste con lo que te dije, margin no solo es para divs, y word-spacing sirve para textos en oraciones no separados en un li.

Saludos
__________________
Grupo Telegram Docker en Español
  #13 (permalink)  
Antiguo 23/03/2010, 16:13
 
Fecha de Ingreso: marzo-2010
Mensajes: 109
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: hacer cabecera

vale, ya me ha salido, ya lo he entendido, eran los margin de cada palabra del listado.
Muchas gracias

Etiquetas: cabeceras
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 16:44.