Mi pregunta es la siguiente estoy realizando una pagina web www.estudioverde.com.co/ceramica.htm en esta parte de la pagina es como un catalogo de obras pero en una resolusion 1024x780 de una pantalla de 17" se ve bn pero cuando la ven desde un portatil con una pantalla mas chica se ve demasiado grande he buscado solución a este problema y dicen que la solucion es diseño elastico o liquido pero no se como hacerlo y por mas qe busco no encuentro solucion si alguin me puede guiar se lo agradecería en el alma
pregunta sobre pagina web
- Iniciador del tema xaznor
- Fecha de inicio
yo no soy experto pero te puedo decir que en lugar de usar px usas porcentajes, en los textos usas em, igual los graficos pues que sean de buena calidad para que no se deformen, en fin es algo complicado, que yo sepa se tiende a usar 1024x768 para que se vea bien en gran parte de las resoluciones, claro que si ves la pagina en una resolucion menor, se va a ver enorme.
Puedes usar en el body esto, y se hara elastico de forma horizontal ... el problema es que normalmente lo elastico funciona cuando tu diseñas pequeño y la pantalla donde se ve es mas grande ... osea la pagina se expande ....
pero tu tienes el problema contrario ... programaste muy grande y "reducirlo" tendrias que usar un buen de css elastico, y probar que tanto distorsiona tu diseño
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
}
.oneColElsCtr #container {
width: 46em;
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 1px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColElsCtr #mainContent {
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
-->
</style></head>
<body class="oneColElsCtr">
Saludos
pero tu tienes el problema contrario ... programaste muy grande y "reducirlo" tendrias que usar un buen de css elastico, y probar que tanto distorsiona tu diseño
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
}
.oneColElsCtr #container {
width: 46em;
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 1px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColElsCtr #mainContent {
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
-->
</style></head>
<body class="oneColElsCtr">
Saludos
mira depende en la hagas o programes
por lo que vi mezclaste html con css
html para le menu e imagenes y un iframe para la galeria sino me equivoco
como lo describes en tu pregunta en equipo de escritorio se ve bien en portatiles (ipad, ipod, blackberry, etc) no se ve bien.
para en ese tipo de casos y respetando tu codigo tendras que hacer 2 paginas diferentes e insertar un detecto de exploradores para que seleccionen el tipo de pagina que es recomendable escoger o un css diseñado para escritorio o portatiles
espero te sirva esto hasta luego
por lo que vi mezclaste html con css
html para le menu e imagenes y un iframe para la galeria sino me equivoco
como lo describes en tu pregunta en equipo de escritorio se ve bien en portatiles (ipad, ipod, blackberry, etc) no se ve bien.
para en ese tipo de casos y respetando tu codigo tendras que hacer 2 paginas diferentes e insertar un detecto de exploradores para que seleccionen el tipo de pagina que es recomendable escoger o un css diseñado para escritorio o portatiles
espero te sirva esto hasta luego