Foros del Web » Creando para Internet » CSS »

Problema con resoluciones

Estas en el tema de Problema con resoluciones en el foro de CSS en Foros del Web. Hola a todos, vereis, tengo una página en la que el contenido está centrado y con una anchura de 770px (el div princuipal que lleva ...
  #1 (permalink)  
Antiguo 02/04/2011, 16:26
 
Fecha de Ingreso: marzo-2011
Mensajes: 88
Antigüedad: 6 años, 8 meses
Puntos: 17
Problema con resoluciones

Hola a todos, vereis, tengo una página en la que el contenido está centrado y con una anchura de 770px (el div princuipal que lleva todo el contenido) el caso es que ahora no quiero que se vea así, quiero expandirla y que ocupe toda la página... hasta ahí bien, sería ponerle un ancho al 100% y listo PERO siempre tengo un PERO!!!

Si le doy de ancho 100% de repente la cabecera y el menú (lo demás no se mueve porque lo tengo en 'px')ya no es fijo, al hacer la ventana pequeña se va desplazando y quiero que aunque se haga pequeña la ventana no se mueva! Si lo pongo en pixeles se queda fijo, he probado con todas las posiciones, fija, absoluta... y nada, se mueve!

¿Es por el '%'? ¿Cúal es la mejor manera de hacer una página que sea visible en todas las resoluciones?

Aquí el código CSS:


Código HTML:
body {
  margin: 0;
  padding: 0;
  background: #F2F5FE url("../imagenes/fondo.gif") 0 0 repeat-x;
  font: 70%/160% "verdana", sans-serif;
  color: #192666;
}

ul, ol {
  margin: 1em 0 1em 2em;
  padding:0;
}

#contenedor {
  width:770px;
  margin: 50px auto 0 auto;
}

#cabecera {
  width: 770px;
  position: relative;
  height: 100px;
  margin: 0;
  padding: 0;
  background: #233C9B url("../imagenes/cabecera.jpg") no-repeat;
  color: #FFF;
}

#contenido {
  width: 760px;
  margin: 0 5px;
  background: #FFF;
}

#contenido #principal {
  float: right;
  width: 530px;
  margin-top: 15px;
  padding:0 0 0 20px;
  background: #FFF;
}

#contenido #secundario {
  float: left;
  width: 200px;
  margin: 15px 0 0 0;
  padding: 0;
  background: #CEDBF9 url("../imagenes/fondo_columna.gif") no-repeat;
}
Espero algún consejo

Muchas gracias!!
  #2 (permalink)  
Antiguo 02/04/2011, 17:26
 
Fecha de Ingreso: marzo-2011
Mensajes: 88
Antigüedad: 6 años, 8 meses
Puntos: 17
Respuesta: Problema con resoluciones

Hola, me auto respondo para decirme a mi mismo... jejeje que ya he resuelto el problemilla, por si alguien cae en este error, que aunque sea tonto puede pasar .....

En el menu, le apliqué esto:

Cita:
ul, ol {
margin: 1em 0 1em 2em;
padding:0;
}
Ahora probando, por muy pequeña que haga la página se mantiene en su sitio así (se puede mejorar el estilo, pero el problema era dar un ancho y un alto):

Código HTML:
ul, ol {
  width:770px;
  height:50px;
  padding:0;  
  position:relative;
}
Y ya está, simplemente asignar el ancho y el alto y ponerlo en posicion relativa...

¿Ahora que hago?, ¿me pongo yo un karma? jejejeje

Saludos a todos!!!

Etiquetas: Ninguno
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 13:54.