Descuadre pagina al minimizar

[sirdaiz]

Hola tengo la siguiente pagina que la estoy haciendo :

www.poloslaurenonline.tk

Se que por el momento esta muy fea pero estoy empezando xD

y tengo el sgte css:

Código CSS:

#contenedor{
    width: 100%;
    height: auto;
    overflow: hidden;
    }
    
body {
    background-image:url('../imagenes/fondo88.jpg');
    background-repeat:no-repeat;
    color:#cccccc;
 
}  
  
#cabecera{
    width: 100%;
    height: 150px;
    text-align:center;
    }
 
#cuerpo{
    
    width: auto;
    height: auto;
    overflow: hidden;
 
    }
    
#lateral{
 
    width: 500px;
    height: auto;
    float: left;
    overflow: hidden;
    }
 
#principal{
        
    width: auto;
    height: auto;
    
    }
 
#pie{   
    width: 1500px;
    height: auto;   
    }
 
#contenido{
    text-align:center;
    width:20%;
}
 

Pero al minimizar se me descuadra todo y aparece donde quiere, informar que lo div lateral y principal su tamaño no es fijo
PD:el servidor esta lento hoy(es gratuito) asi q a lo mejor teneis q esperar a q carue de todo la pagina xD
Gracias

Saludos

[cuervo699]

no carga la pagina, aparece error! :/

[sirdaiz]

ya va

Saludos

[tinocastro]

Iniciado por sirdaiz

Hola tengo la siguiente pagina que la estoy haciendo :

[url]www.poloslaurenonline.tk[/url]

Se que por el momento esta muy fea pero estoy empezando xD

y tengo el sgte css:

Código CSS:

#contenedor{
    width: 100%;
    height: auto;
    overflow: hidden;
    }
    
body {
    background-image:url('../imagenes/fondo88.jpg');
    background-repeat:no-repeat;
    color:#cccccc;
 
}  
  
#cabecera{
    width: 100%;
    height: 150px;
    text-align:center;
    }
 
#cuerpo{
    
    width: auto;
    height: auto;
    overflow: hidden;
 
    }
    
#lateral{
 
    width: 500px;
    height: auto;
    float: left;
    overflow: hidden;
    }
 
#principal{
        
    width: auto;
    height: auto;
    
    }
 
#pie{   
    width: 1500px;
    height: auto;   
    }
 
#contenido{
    text-align:center;
    width:20%;
}
 

Pero al minimizar se me descuadra todo y aparece donde quiere, informar que lo div lateral y principal su tamaño no es fijo
PD:el servidor esta lento hoy(es gratuito) asi q a lo mejor teneis q esperar a q carue de todo la pagina xD
Gracias

Saludos

Buenas,
lo primero es que veo los height en auto, los puedes eliminar y seguiran en auto. lo que si haria para corregir este problema sería colocar margin:0 auto; en contenedor y body.
A ver si así se corrige el problema, espero ayudarte, un saludo

[sirdaiz]

Hola de nuevo, gracias por vuestras ayudas, he realizado los siguienets cambios:

Tengo un general.css

Código CSS:

#contenedor{    
    overflow: hidden;
    margin:0 auto;
    }
    
body {
    background-image:url('../imagenes/fondo88.jpg');
    background-repeat:no-repeat;
    color:#cccccc;
    margin:0 auto;
 
}  
  
#cabecera{   
    height: 150px;
    text-align:center;
    }
 
#cuerpo{    
    width: auto;
    overflow: hidden;
    }
    
#lateral{
    width: 500px;
    float: left;
    overflow: hidden;
    }
 
#principal{     
    width: auto;  
    }
 
#pie{   
    width: 1500px;
    }
 
#contenido{
    text-align:center;
    width:20%;
}
 

y otro menu.css que es la barrita de menu que aparece en mi web,y esta es la que cuando miniminizo se descuadra entera:

Código CSS:

#menu_barra {    
    
    height: auto;
   border-style:2;
    font-size: 0.7em;
    overflow: hidden;
}
 
#menu_barra ul {
    list-style-type: none;
}
 
#menu_barra ul li.nivel1 {
    float: left;
    width: 195px;
 
 
}
#menu_barra ul li a {
    display: block;
    text-decoration: none;
    color: #00FF00;
    background-color:black;
    border: solid 1px #fff;
    padding: 8px;
    position: relative;
 
}
 
#menu_barra ul li:hover {
    position: relative;
}
 
#menu_barra ul li a:hover, #menu ul li:hover a.nivel1 {
    background-color: #00008B;
    color: #000;
    position: relative;
}
 
#menu_barra ul li a.nivel1 {
    display: block!important;
    display: none;
    position: relative;
}
 
#menu_barra ul li ul {
    display: none;
}
 
#menu_barra ul li a:hover ul, #menu_barra ul li:hover ul {
    display: block;
    position: absolute;
    left: 0px;
}
 
#menu_barra ul li ul li a {
    width: 120px;
    height: 10px;
    padding: 6px 0px 8px 0px;
    border-top-color: #000;
 
}
 
#menu_barra ul li ul li a:hover {
    border-top-color: #000;
    position: relative;
}
 

Alguna ayuda please?

Gracias

[Ribon]

Bueno si no quieres que se deforme trata de utilizar anchos porcentuales y min-width y max widths, ve probando y después los haces simples xD!

Pero ojo que si ven tu web en un movil se va a ver igual de ancha y tendrías que hacer nuevos frontends compatibles etc.

(si minimizas forosdelweb igual se deforma un poquito xD!