Problemas con el diseño según ventana de explorer

[Martinico]

Hola,

antes que nada perdón si no es el lugar apropiado para postear mi duda, pero realmente no sé donde postear el siguiente problema que tengo:

tengo una web que el diseño es algo como:

Empresa Imágenes
Exito .....
Equipo .... texto...
Contactenos

es decir, tengo una barra a la izquierda y en el medio muestro info según lo que clickee en la barra.

el tema es que una ventana maximizada...me lo muestra así, pero si no maximizo la ventana me queda algo como:

Empresa
Exito
Equipo
Contactenos

Imágenes
....
.... texto...


es decir, me queda la barra, y lo del medio que me quedaba en la maximizada me queda abajo, no en la misma horizontal...


no tengo ni idea que puede ser, pero si sé que es un problema de mi página, porque probé hacer lo mismo en otras páginas, por ejemplo en esta, y al no maximizar esta ventana no se me corre todo para abajo.


Si alguien me da una mano se lo agradezco

saludos,
Martín

[Apolo]

Tema movido desde el foro de Web Hosting hacia el foro Web general.

Saludos,

[berthely]

Danos mas informacion, estas usando css, o tablas, o que rollo, manda un screenshot y con gusto resolvemos tus dudas

[Martinico]

mirá, soy bastante novato, no tengo ni idea que es un screenshot, pero está hecha con css si...

además te agradezco, pero no tengo como idea que me resuelvan todo, sino más bien tener una idea de que puede ser para poder investigarlo yo, antes de postear estuve vichando algunos manuales y como no tuve éxito, opté por postear.

Creo que lo que me está pasando es que en css quedan fijos los largos de los controles, y por eso no se "adapta" la pantalla cuando no está maximizada...pero supuse que existiría alguna función en javascript u algo para estos problemas, pero no la encontré...

por tanto, sigo sin resolver mi problema y abierto a respuestas.

saludos,
Martín

[berthely]

lo que tienes que hacer es ponerle en el css

Código:

#contenedor{
     width:auto;
}

y en el html

Código HTML:

<div id="contenedor">
    <!--  contenido del sitio -->
</div> 

para que el ancho del contenedor se ajuste a la ventana aunque la maximises o la minimises.

[Martinico]

bien te entendí,

no conocía el "auto"...

gracias!!

Martín

[Martinico]

probé con lo que me comentaste y no pude..

tengo una barra a la izquierda y me queda siempre arriba ahora
y el texto siempre abajo...alguna idea?

[berthely]

Iniciado por Martinico

probé con lo que me comentaste y no pude..

tengo una barra a la izquierda y me queda siempre arriba ahora
y el texto siempre abajo...alguna idea?

¿Podrías mandar fragmentos del código para poder ayudar mejor?.

[Mikmoro]

Iniciado por Martinico

es decir, me queda la barra, y lo del medio que me quedaba en la maximizada me queda abajo, no en la misma horizontal...

Hola, Martín.

Imagino que se debe a que no tienes un ancho mínimo definido en el contenedor de esos componenetes, y sin embargo sí lo tienes en ellos mismos. ¿qué es lo que te ocurre? que cuando las cosas no caben en una línea saltan a la siguiente.

Si tienes todo eso dentro de un contenedor, podrías resolverlo poniendo esto en la css:

#contenedor {min-width: 800px;
width: auto!important;
width: 800px;
}

Suponiendo que 800 fuera el tamaño que quieres, que también podrías poner en porcentaje o como quieras.

Lo mejor es que muestres el código para dar con la solución exacta.

Mikel.

[Martinico]

sigo teniendo el mismo problema...

tengo la barra a la izquierda, y lo que muestra la página en el medio según lo que aprete en la barra..

pero si achico horizontalmente la ventana me queda la barra arriba y lo que muestra en el medio debajo de la barra.


probé poniendo auto en todos los width y me sigue pasando lo mismo, si pongo AUTO en el que dice 15%, se me va la barra para arriba y me queda horizontalmente (hoy la tengo verticalmente en la izquierda de la página)

agradezco cualquier ayuda

saludos,


ADJUNTO EL CODIGO DEL CSS:


////////////////////////////////////////////////////////////////////////////////////////////////////

/* CSS Document */
#leftcontent { float:left; width:15%; background-color:#454545; border-right:0; border-bottom:0; margin-right:0px; padding:0px; padding-left: 20px; padding-right: 20px; padding-top: 10px; padding-bottom: 10px; } #leftcontent .column { float:left; margin-top: 10px; padding: 0px; border: 0; }
#leftcontent .colelement { margin-top: 3px; padding: 0px; border: 0; width: 154px; height:23px; } #leftcontent .imagen { float:left; vertical-align: 0% } #rightcontent { float: left; width: 780px; margin: 0px; padding: 0px; border: 0px; background-color: #9C9C9C; } #rightcontent .texto{ margin-top: 20px; padding-left: 30px; padding-right: 10px; width: 730px; } #rightcontent .imagen1{ padding-left: 150px; padding-right: 0px; width: 600px; }
#rightcontent .imagen2{ padding-left: 0px; padding-right: 0px; width: 600px; } #rightcontent .vacio{ padding-left: 0px; padding-right: 0px; width: 640px; padding-bottom:300px; } #rightcontent .imgcontrol{ padding-left: 70px; padding-top: 50px; padding-bottom: 50px; width: 600px; } #rightcontent .imgservicios{ padding-left: 250px; padding-top: 10px; padding-bottom: 50px; width: 256px; height:279px; } #rightcontent .imgfabricacion{ padding-left: 100px; padding-top: 50px; padding-bottom: 50px; width: 283px; height:333px; } #rightcontent .piepag{ padding-left: 0px; padding-right: 0px; width: 750px; } body, html {margin: 0px;padding: 0px;font-family: Arial, Verdana, Helvetica, sans-serif;font-weight:normal;font-size:12px;color: #313131;background-color: #454545;}
p {margin: 0px;padding: 2px 5px 5px 5px;font-size:12px;line-height:13px;color:#313131;text-align: left;}
H1 {font-size:15px;margin: 0px;padding: 0px 0px 0px 2px;}
H2 {font-size:12px;margin: 0px;padding: 0px 1px 1px 1px;}
H3 {font-size:12px;margin: 0px;padding: 0px 15px 7px 15px;}
H4 {font-size:14px;margin: 0px;padding: 12px 0px 10px 0px;}
H5{font-size:9px;margin: 0px 70px;padding: 12px 0px 10px 0px;}
a:link {color: #AE0000;}
a:visited { color: #AE0000;}
a:active { color: #AE0000;}
a:link, a:visited, a:active {padding: 0px;margin: 0px;text-decoration:none;font-weight:bold;}
a:onmouseover { color:red;}
img {margin: 0px;padding: 0px;}
#contenedor {margin: 0px;padding: 0px;background-color:#F3F3F3;width:auto;text-align:left;}

ul { list-style: square outside; font-size:12px; color: #313131; margin: 0 20px 0 40px;}
li { padding: 0px 0px 5px 1px;}
.lista1 {list-style: disc; padding: 50px 50px 100px 500px;}
dl { list-style: disc outside; font-size:12px; color: #313131; margin: 0 20px 0 40px;}