Inicio > Mis eListas > hcc > Mensajes

 Índice de Mensajes 
 Mensajes 772 al 791 
AsuntoAutor
Re: Problemas con Daniela
RE: Problemas con Esteban
Re: ¿mejor class o Juan R.
Re: center Juan R.
Re: Sangría de pár Juan R.
Re: ay las plantil Juan R.
Re: Editor de pagi Juan R.
Re: Problemas con Daniela
Re: Presentación R Iolusia
criticar web Oscar Me
RE: Problemas con Esteban
Re: Presentación R Colt. Ma
Re: Problemas con Daniela
Re: criticar web Ximena C
Re: Presentación R Oscar Me
Re: criticar web Jessica
Re: criticar web Oscar Me
Re: criticar web Ju@nChi
Re: criticar web Hector G
Verificacion de Pá Enrique
 << 20 ant. | 20 sig. >>
 
HTML con Clase
Página principal    Mensajes | Enviar Mensaje | Ficheros | Datos | Encuestas | Eventos | Mis Preferencias

Mostrando mensaje 773     < Anterior | Siguiente >
Responder a este mensaje
Asunto:Re: [hcc] Problemas con css
Fecha:Lunes, 4 de Febrero, 2002  02:07:24 (-0300)
Autor:Daniela Blanco <danielablanco @.......com>

Perdón que siga insistiendo con esto pero necesito solucionarlo cuanto antes
y son los únicos que pueden ayudarme.
Casi logro tener el aspecto que quería para mi página, salvo dos detalles:
1) Aunque pongo width: 100%, me queda una franja en el lado derecho de mi
pantalla en blanco, es decir sin estilo como debería ser.
2) Algo similar pasa con el alto, aunque pongo height: 100%, aparece parte
en blanco de la pantalla. En este caso "sobra", en lugar de faltar (aparece
la barra de desplazamiento que no debería). ¿Se entiende?
Adjunto los archivos. Desde ya muchas gracias.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<LINK media=screen href="estilo.css" type=text/css rel=stylesheet>
</HEAD>

<BODY>
   <div class="arriba">
       <p id="encabezado"><img src="imagenes/principal.gif" width="500"
height="56" alt="Titulo"></p>
  </div>

   <div class="izqui">
      <img id="escudo" src="imagenes/escudo.gif" width="98" height="100"
alt="Escudo">
   </div>
   <div class="esquina"></div>

   <div class="menu">
       <br>
     <p class="pazul">Principal</p>
     <p class="pblanco"></p>
     <p class="projo">El Club</p>
     <p class="pblanco"></p>
     <p class="pazul">Noticias</p>
     <p class="pblanco"></p>
     <p class="projo">Equipos</p>
     <p class="pblanco"></p>
     <p class="pazul">Eventos</p>
     <p class="pblanco"></p>
     <p class="projo">Fotos</p>
     <p class="pblanco"></p>
     <p class="pazul">Tercer Tiempo</p>
     <p class="pblanco"></p>
     <p class="projo">Links</p>
   </div>

<DIV class="cuerpo">
Contenido de la página
</DIV>

</BODY>
</HTML>

Archivo .css:

body {
 color: #000080;
 background-color: #FFFFFF;
}

.arriba {
 position: absolute;
 width: 100%;
 height: 78px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
 background-image: url(imagenes/arriba.gif);
}

.izqui {
 position: absolute;
 width: 120px;
 height: 100%;
 top: 0;
    right: 0;
    bottom: 0;
    left: 0;
 BACKGROUND-IMAGE: url(imagenes/bordeizq.gif);
}

.esquina {
 position: absolute;
 width: 24px;
 height: 98px;
 top: 0;
    right: 0;
    bottom:0;
 left: 117px;
 BACKGROUND-IMAGE: url(imagenes/esquina.gif);
}

.cuerpo {
 position: absolute;
 width: 100%;
 height: 100%;
 top: 78px;
    right: 0;
    bottom:0;
 left: 0;
    padding-left: 130px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

#escudo {
 position: absolute;
    left: 10px;
    top: 10px;
}

#encabezado {
    text-align: center;
    padding-left: 120px;
    padding-top: 10px;
}

.menu {
 position: absolute;
 width: 120px;
 height: auto;
 top: 110px;
    right: 0;
    bottom: 0;
    left: 0;
    color: #FFFFFF;
    font-family: arial, sans-serif;
 font-size: 12pt;
    text-align: left;
}

.projo{
 padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 4px;
    padding-right: 2px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 3px;
    background-color: #FF0000;
}

.pblanco{
 padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 4px;
    padding-right: 2px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 3px;
    background-color: #FFFFFF;
}
.pazul{
 padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 4px;
    padding-right: 2px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 3px;
    background-color: #000080;
}

.oculto {
 visibility: hidden;
}

Daniela Blanco
danielablanco@...
----- Original Message -----
From: "Daniela Blanco" <danielablanco@...>
To: <hcc@...>
Sent: Sunday, February 03, 2002 2:21 PM
Subject: Re: [hcc] Problemas con css


> Gracias Miguel. Cambiando a absolute pude mejorarlo un poco, aunque
todavía
> no me queda del todo bien. Hay unas separaciones entre las secciones que
no
> logro corregir.
> Ahora quedo así:
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
> <HTML>
>  <HEAD>
>   <LINK media=screen href="est2.css" type=text/css rel=stylesheet>
>   <title>Título</title>
>  </head>
>
>  <body>
>
>   <div id="encabezado">
>   <p align="center">
>   <img id=imgtitulo alt="Titulo" src="imagenes/principal.gif" width="500"
> height="56" border="0">
>   </p>
>   </div>
>
>   <div id="menu">
>   Menu
>   </div>
>
>   <div id="publicidad">
>   Banners
>   </div>
>
>   <div id="principal">
>   Contenido
>   </div>
>
>  </body>
> </html>
>
> body {
>  background-color: #EFF7CE;
> }
>
> #encabezado {
>  position : absolute;
>  width: 70%;
>  height: 15%;
>  top: 2%;
>  right: 10%;
>  boottom: 0;
>  left: 15%;
>  border : 1px solid #000000;
> }
>
> #menu {
>  position : absolute;
>  width: 15%;
>  height: auto;
>  top: 2%;
>  right: 0;
>  boottom: auto;
>  left: 0;
>  border : 1px solid #000000;
> }
>
> #publicidad {
>  position: absolute;
>  width: 15%;
>  height: auto;
>  top: 2%;
>  right: 0;
>  boottom: auto;
>  left: 85%;
>  border: 1px solid #000000;
> }
>
> #principal {
>  position: absolute;
>  width: auto;
>  height: auto;
>  top: 17%;
>  right: 15%;
>  boottom: 0;
>  left: 15%;
>  border: 1px solid #FF0000;
>  background-color: #FFFFFF;
> }
>
> Estoy modificando un sitio con frames, pero pensaba que sería más fácil y
> sobre todo más rápido (¡en unos días ya tenía que estar listo!). Gracias a
> todos por su ayuda
>
> Daniela Blanco
> danielablanco@...
> ----- Original Message -----
> From: "Miguel Ortiz Díaz" <miguel12000@...>
> To: <hcc@...>
> Sent: Saturday, February 02, 2002 5:19 PM
> Subject: RE: [hcc] Problemas con css
>
>
> Hola Daniela:
> Una de las posibilidades es la de cambiar la definición de 'position'  de
> "fixed" a "absolute", esta definición te da una manjabilidad total sobre
el
> objeto, es decir tú lo pones donde dices, eso sí creo que debes pensar
bien
> en las proporciones de los cuadros que elaboras y, si cambias a absolute,
> debes especificar bien las dimensiones para calcular el tamaño y poder
poner
> enseguida el siguiente cuadro, para dejar el espacio en blanco, en vez de
> dar espacio de 15%, dar de 20% en 'top' de las clases principal, menú y
> publicidad, creo que con eso puede salir mejor.
>
>
> ----- Mensaje original -----
> De: Daniela Blanco
> Enviado: Sábado, 02 de Febrero de 2002 07:01 a.m.
> Para: hcc@...
> Asunto: [hcc] Problemas con css
>
> Estoy tratando de armar algo así:
>
> |            |    Encabezado    |                   |
> |            |--------------------------|                   |
> |            |                          |                   |
> |  Menú  |    Principal         |   Publicidad  |
> |            |                          |                   |
> |            |                          |                   |
>
> Les adjunto los archivos porque algo no está bien y no se como arreglarlo.
> No se ve como quiero. Muchas gracias.-
>
> Esta es la página html:
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
> <HTML>
> <HEAD>
>   <LINK media=screen href="est2.css" type=text/css rel=stylesheet>
>   <title>Título</title>
> </head>
>
> <body>
>
>   <div id="principal">
>   Contenido
>   </div>
>
>   <div id="encabezado">
>   Encabezado
>   </div>
>
>   <div id="menu">
>   Menu
>   </div>
>
>   <div id="publicidad">
>   Banners
>   </div>
>
> </body>
> </html>
>
> Y el .css:
>
> #encabezado {
> position : fixed;
> width: 100%;
> height: 15%;
> top: 0;
> right: 0;
> boottom: auto;
> left: 0;
> border : 1px solid #0000FF;
> }
>
> #menu {
> position : fixed;
> width: 15%;
> height: auto;
> top: 15%;
> right: auto;
> boottom: auto;
> left: 0;
> border : 1px solid #00FF00;
> }
>
> #principal {
> position: fixed;
> width: auto;
> height: auto;
> top: 15%;
> right: 15%;
> boottom: 0;
> left: 15%;
> border: 1px solid #FF0000;
> }
>
> #publicidad {
> position: fixed;
> width: 15%;
> height: auto;
> top: 15%;
> right: 15%;
> boottom: auto;
> left: auto;
> border: 1px solid #DDDDDD;
> }