1. ¡OFERTA! con cupón "DIRVPS": hosting por $0,01 y también VPS Linux y Windows por $0,01 el primer mes por Interserver ← publi
    Descartar aviso
Descartar aviso
Al usar este sitio web, aceptas que nosotros y nuestros socios podamos establecer cookies para fines tales como personalizar el contenido y la publicidad. Más información.

problema con css y estrucura web

Tema en 'Programación y Diseño Web' iniciado por mxsoun, 15 Ene 2013.

  1. mxsoun

    mxsoun Usuario activo

    hola buen dia tengo un problema con html y css estoy creando una web, pero tengo varios errores uno de ellos es que si por ejemplo el menu de lado izquiero se deplaza una parte del div se desplaza
    dejo una imagen
    [​IMG]
    si los dos menus estan llenos se centra esa parte. de entrada no se como corregir ese error.

    otra cosa que quiero corregir es que la parte de noticias y promos queden en en centro mitad y mitad pero tambien no lo e logrado
    a la vez dejo mi codigo en html y css
    CODE, HTML o PHP Insertado:
    

<html> 
<head> 
 
<link rel="stylesheet" href="style.css" type="text/css"/>
<title>wegb </title> 
</head> 
<body> 
<div id ="cabecera"><center>logo</center> </div>
<div id ="pmenu">menu
</div> 
<div id ="menu_izq"> mi menu izquiero </div> 
<div id ="menu_der">menu derecho <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>  </div>
<div id ="cuerpo">
texto
</div> 
<br> 
<br> 
<div id ="contenedor1">
<div id ="noticias">noticias <br></div>
<div id ="promos">promos</div>
</div><br> 
<br><br>
</body>
</html>

    y el css
    CODE, HTML o PHP Insertado:
    BODY { 
     
    background-color: #000000; 
    font-style: Helvetica Calibri;
    font-size: 14px;
    font-color:#000000;
    
} 
#cabecera{ 
     
    color: #333300; 
    width:100%; 
} 
#pmenu{  
    color: #333300; 
    width:100%; 
} 

#cuerpo{ 
width: 70%; 
 overflow: hidden;
     margin: auto; 
     border-left: #FF6600 2px solid;
     border-right: #FF6600 2px solid;
     background-color: #EDEEF8;
     padding: 5px; 
 
} 
#menu_izq{ 
overflow: hidden;
text-align: center; 
      float:left;
  
     width: 13%;
    
 
     background-color:#FF0100;

} 
#menu_der{ 
  text-align: center;    
 width: 13%; 
   	float: right;
     background-color:#FF0100;

} 
#contenedor1{ 
 
width: 70%; 
 overflow: hidden;
     margin: auto; 
     border-left: #FF6600 2px solid;
     border-right: #FF6600 2px solid;
     background-color: #EDEEF8;
     padding: 5px; 


} 
#noticias{
width: 35%; 
float:left;
background:#CC6600;
} 
#promos{
width: 35%;
float:right;
border-left: #FF6600 1px solid; 
; 
background:#CC6600;
} 
#contenedor2{ 
width: 99%; 
    overflow: hidden;
     border-left: #FF6600 2px solid;
     border-right: #FF6600 2px solid;
     background-color: #EDEEF8;
     padding: 5px;
      } 
#afiliados{ 
background: #fc3;
width:25%;
float: left;
} 
#terceros{
border-left: #FF6600 1px solid;
background: #fc3;
width:25%;
float: left;
}
#sociales{
border-left: #FF6600 1px solid;
background: #fc3;
width:25%;
float: left;
}
#derechos{
border-left:#FF6600 1px solid;
background: #fc3;
width:24.7%;
float: left;
}
    espero me puedan ayudar gracias.
     
    mxsoun, 15 Ene 2013
    #1
  2. Anunciante

    Anunciante

     
  3. Xordiii

    Xordiii Nuevo usuario

    No entiendo muy bien el problema pero te explico como lo he entendido yo.

    Tu problema es que la barra del noticias y promo quieres que te salga en el cuerpo y no te coja nada de los menus de los lados (derecho y izquierdo) cosa que el derecho ya esta bien.

    Si este es el problema, haz esto:

    Divide la web en 3 partes, menu izquierdo, centro y menu derecho => 3 div's.

    Al menu del centro creas los div's que tu quieras dentro.

    De esta forma nunca te cojera el menu de los lados.

    Tu tenias los divs separados... si te fijas de esta forma, te salen mas errores... sobretodo si lo abres con el Internet Explorer, Firefox o Google Chrome te sale la web de diferentes maneras!

    (no puedo enseñarte el css porque no puedo hacer nada aqui a este ordenador, cuando llegue a casa, te lo pego).

    Saludos :)

    Xordiii
     
    Xordiii, 15 Ene 2013
    #2
  4. mxsoun

    mxsoun Usuario activo

    buen dia gracias por tu respuesta en si el problema que tengo es que el contenedo1 se dezplaza si se agranda el menu izquierdo o derecho pero si los dos izquirod y derecho estan casi del mismo tamaño se centra queda como deveria estar. ese es el problema que tengo pero no se como solucionarlo
     
    mxsoun, 15 Ene 2013
    #3
  5. Sphyr0

    Sphyr0 Usuario activo

    No me queda muy claro el asunto... :confused: el problema es que el bloque que contiene "noticias - promos" esta hacia la izquierda? es decir, utilizando parte del espacio del bloque "mi menu izquierdo"..? :rolleyes:
     
    Sphyr0, 16 Ene 2013
    #4
  6. Xordiii

    Xordiii Nuevo usuario

    CODE, HTML o PHP Insertado:
    <html> 
<head> 
 
<link rel="stylesheet" href="style.css" type="text/css"/>
<title>wegb </title> 
</head> 
<body> 
<div id ="cabecera"><center>logo</center> </div>
<div id ="pmenu">menu
</div> 
<div id ="menu_izq"> mi menu izquiero </div> 
<div id ="menu_der">menu derecho <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>  </div>
<div id ="cuerpo">
texto
<br> 
<br> 
<div id ="contenedor1">
<div id ="noticias">noticias <br></div>
<div id ="promos">promos</div>
</div>
</div> <br> 
<br><br>
</body>
</html>
    Entonces haz un div (por ejemplo cuerpo) que tenga TODO lo que esta al centro. Ahora aunque agrandes y hagas pequeño, seguirá bien.

    No te e tocado los estilos... pero es solo porque lo veas.
     
    Xordiii, 18 Ene 2013
    #5
  7. disecain

    disecain Nuevo usuario

    Hola a todos.

    mxsoun no estas usando float adecuadamente. Haz caso a xordii.
    Como yo hago un layout de tres columnas es haciendo tres <div> generales, flota 2 a un lado y el tercero al otro lado y dales los porcentajes que quieras sin margin auto. El <div> 2 es el central. Usa porcentajes si quieres para los margin y para los width.

    Mira en Firebug los márgenes computados para "contenedor1", verás que los márgenes son demasiado.
    Conclusión: float+ margin:auto NO
     
    disecain, 30 Ene 2013
    #6


Alojamiento web, Hosting Reseller, Servidores Dedicados - All in Hosting


    
    
    
    
Blog · Sitios amigos: GuiaHosting · Unidominios · Interalta ·