Minimizar pagina html

gelord · #1 (**permalink**) 19/12/2009, 07:24

Perdonad mi explicación pero a ver si me entiende alguien.

Estoy haciendo una pagina web con el bloc de notas de windows, sin java script ni nada. El caso es que tengo varias div y dejo unos margenes laterales, tanto a izquierda como a derecha de la página, y al minimizar la pantalla del navegador me aparecen los margenes y la div que tengo en el medio se me hace muy pequeña e incluso de desencuadran las imagenes que tengo en ella.

Mi intención es que cuando minimice la pantalla del navegador, los márgenes desaparezcan como pasa con la página de AS.com por ejemplo, que tiene unos márgenes negros que cuando se minimiza no aparecen.

Espero que alguien haya entendido mi pregunta y me puede dar una solución porque estoy un poco saturado y no encuentro ninguna forma. Gracias

Cabos · #2 (**permalink**) 19/12/2009, 09:55

Creo que con CSS no se puede hacer, con Javascript seguro que puedes.

jomaruro · #3 (**permalink**) 19/12/2009, 11:40

Hola:

Cita:

Iniciado por Cabos

Creo que con CSS no se puede hacer, con Javascript seguro que puedes.

Alguno estaría más guapo calladito y no induciendo a errores.

No sé como tienes estructurada tu página pero a ver si puedo ayudarte. Debes olvidarte de los margenes laterales y centrarte solo en el div central. El problema lo solucionas creando solo div central con un tamaño fijo (unos 960px es lo más corriente) y metiendo todo tu contenido en él.

Después, tu hoja CSS la inicias con un reset.

Código:

* {
padding:0;
margin:0 auto;
}

Y ya tienes tu página como querías, para muestra el código siguiente, pruebalo.

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Div centrado</title>
        <style type="text/css">
            * {
                padding:0;
                margin:0 auto;
            }
            #contenedor {
                border: 1px solid #ff0000;
                background-color:#00ff00;
                width:960px;
                height:600px;
            }
        </style>
    </head>
 
    <body>
        <div id="contenedor>
        </div>
   </body>
</html>

Saludos.

Cabos · #4 (**permalink**) 19/12/2009, 11:57

Lo siento, la próxima vez me lo miro mejor.
Sin embargo, estarás de acuerdo conmigo en que con javascript puede quedar mejor, puesto que, dependiendo de la resolución de la pantalla i de el tamaño de la ventana minimizada puede no funcionar.

Por cierto, tu código tiene un error, no es:

Código HTML:

<div id="contenedor>

sinó:

Código HTML:

<div id="contenedor">

Saludos

C2am · #5 (**permalink**) 19/12/2009, 13:17

Hola, voy a meter la cuchara.
Cabos, puede ser que con javascript se pueda hacer, pero si se tiene desactivado no funcionaria, y el css sí, (puntos para el css)
Y como es el subforo de css, me parece que es mejor la solución.
además dice que: "Estoy haciendo una pagina web con el bloc de notas de windows, sin java script ni nada."

No pretendo decir que el javascript sea mejor o peor que el css, son cosas distintas.

Saludos y haces bien en corregir ese error de cierre de comillas.

Cabos · #6 (**permalink**) 19/12/2009, 14:20

Cita:

Iniciado por C2am

Hola, voy a meter la cuchara.
Cabos, puede ser que con javascript se pueda hacer, pero si se tiene desactivado no funcionaria, y el css sí, (puntos para el css)
Y como es el subforo de css, me parece que es mejor la solución.
además dice que: "Estoy haciendo una pagina web con el bloc de notas de windows, sin java script ni nada."

No pretendo decir que el javascript sea mejor o peor que el css, son cosas distintas.

Estoy de acuerdo contigo, solo digo que le podría funcionar mejor, pero si ya le va bien así, por mí genial.

Salu2

jomaruro · #7 (**permalink**) 19/12/2009, 15:17

Hola:

Y seguramente también se pueda hacer con PHP, ASP clásico, ASP.NET, Java, y cientos de lenguajes de programación.

Saludos.

gelord · #8 (**permalink**) 22/12/2009, 06:53

Gracias jomaruro era justo lo que estaba buscando, muchas gracias... Bueno y al resto tambien claro, lo que pasa es que tengo un nivel muy básico y javascrpit no lo utilizo, pero muchas gracias en serio

jomaruro · #9 (**permalink**) 22/12/2009, 14:17

Hola:

Cabos, gracias por la corrección.

Gelord, te pueden ser útiles los siguientes manuales de CSS:

1º Introducción a CSS.
2º CSS Avanzado.

Los puedes consultar online o descargartelos en PDF y son totalmente gratuitos.

Saludos.