Re: [Ovillo] Pegar DIV al bottom de la ventana

2006-11-07 Por tema Nidia Fernandez Martinez
Yo también tuve ese problema! Espera, que voy a ver como lo solucioné...

El día 7/11/06, webmaster [EMAIL PROTECTED] escribió:

 Ok, esto funciona bien, pero tiene un problemita,
 Has una página Web, donde el contenido sea mayor (en el alto) al tamaño de
 un pantallaza en el navegador, entonces, lamentablemente por alguna razón,
 position:absolute;  no funciona bien, y te deja el footer, a la mitad de la
 pantalla, o donde terminaba la pantalla original.

 Pruebalo, pero si no tienes páginas con tanto contenido, en hora buena
 solucionaste tu problema :)


Yo también tuve el mismo problema, lo que no recuerdo es qué hice
exactamente para solucionarlo... juraría que fue algo tan absurdo como
sustituir la declaración inicial por esta:


!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN
http://www.w3.org/TR/html4/loose.dtd;

porque tengo el recuerdo de haber hecho un cambio global en
dreamweaver, pero no estoy segura 100%. Por si acaso, te paso la
dirección de la hoja de estilos que yo usé:

http://www.efeyl.org/pruebas/nidia/batallas/estilo.css

Un saludo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] IE no dibuja bien las capas

2006-11-06 Por tema Nidia Fernandez Martinez
2006/11/6, Maikel Naigt [EMAIL PROTECTED]:

 Hola Nidia. Veamos tus problemas tras tu solicitud de ayuda.

 On 11/3/06, Nidia Fernandez Martinez [EMAIL PROTECTED] wrote:
 
  Hola,
 
  Estoy trabajando en la siguiente web:
  http://www.efeyl.org/pruebas/EFEYLBATALLITAS/index.php
 
  En Firefox se ve perfectamente, tal y como debería verse según el código
  escrito. La estructura del sitio es más o menos así:
 
  body
div id=todo
  div id=banner/div
  div id=borde_cuadros/div
  div id=menuycuerpo
div class=menu/div
div id=cuerpo
  div class=contenedor
div class=texto/div
  /div
/div
div id=pie/div
  /div
/div
  /body
 
  Sin embargo en IE ignora la capa menuycuerpo por completo. Se nota
  porque
  el menú no tiene separación con el banner, y el cuerpo está a otra
 altura
  distinta. Además, no sé por qué misteriosas razones, no se dibujan los
  bordes superiores del contenido bien. Copio y pego aquí la hoja de
  estilos,
  por si a alguien le interesa:


 El problema que te surge de que el menú te aparezca pegado a la cenefa de
 cuadros superior se debe a que no le indicas ningún margen. Te pego la
 parte
 de la hoja de estilos más o menos por el final de la misma.

 /* common styling */
 ...
 .menu ul {padding:0; margin:0;list-style-type: none; }
 .menu ul li {float:left; position:relative; padding:0; margin:0;}
 ...

 Evidentemente, estos 'margin:0' nos sobreescriben cualesquiera que hubiera
 con anterioridad, haciendo que el bloque del menú este junto a la cenefa.

 En cuanto al segundo problema es un poco más complicado de comprender, y
 está relacionado directamente con una propiedad 'Made in M$' denominada
 'hasLayout' [1] y que le indica al motor de IE cuándo un bloque es etéreo
 como las nubes del anuncio de las compresas (valor false) y cuándo deberá
 ser sólido y fuerte como la espada del Cid (valor true). Seguramente ya
 hayas adivinado que tu bloque fantasma ha sido elegido como 'hasLayout'
 en
 'false'. Necesitaremos pues revertir esta situación, aunque existe un
 problemilla, y es que la propiedad 'hasLayout' no es 'escribible' si no
 que
 se sitúa en uno u otro estado dependiendo de las propiedades de estilo que
 tenga asignado el bloque. Afortunadamente, M$ nos da una lista de estas
 propiedades [2] para que elijamos la que más nos guste. Simplemente
 deberás
 poner una de estas propiedades en, por ejemplo, el bloque '#contenedor'
 (prueba con 'display: inline-block' para ver el resultado) y problema
 resuelto.

 [1] http://www.satzansatz.de/cssd/onhavinglayout.html
 [2]

 http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/haslayout.asp

 Un saludo,
 David Merino Ogando


Muchas gracias por la ayuda. El problema principal es que como relacionaba
el fallo con ningún elemento de la página, no sabía por donde empezar a
investigar. En cuanto tenga un rato lo pruebo y cuento el resultado.

Un saludo :)


-- 

Nidia Fernández Martínez
Alhana, Alhanita, Nahriah...
http://alhanita.blogspot.com

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


[Ovillo] IE no dibuja bien las capas

2006-11-03 Por tema Nidia Fernandez Martinez
Hola,

Estoy trabajando en la siguiente web:
http://www.efeyl.org/pruebas/EFEYLBATALLITAS/index.php

En Firefox se ve perfectamente, tal y como debería verse según el código
escrito. La estructura del sitio es más o menos así:

body
  div id=todo
div id=banner/div
div id=borde_cuadros/div
div id=menuycuerpo
  div class=menu/div
  div id=cuerpo
div class=contenedor
  div class=texto/div
/div
  /div
  div id=pie/div
/div
  /div
/body

Sin embargo en IE ignora la capa menuycuerpo por completo. Se nota porque
el menú no tiene separación con el banner, y el cuerpo está a otra altura
distinta. Además, no sé por qué misteriosas razones, no se dibujan los
bordes superiores del contenido bien. Copio y pego aquí la hoja de estilos,
por si a alguien le interesa:

* html,body {
height:100%;
margin:0px;
padding:0px;
}

body {
background-color:#44;
background-image:url(imagenes/fondo.gif);
color:#f1e9c9;
font-family:Georgia, Times New Roman, Times, serif;
font-size:90%;
}

#todo {
height:100%;
min-height:100%;
position:relative;
margin: 0px auto;
}

#banner {
width:100%;
background-color:#4C0909;
text-align:center;
}

#borde_cuadros{
background-image: url(imagenes/fondo_cuadros.gif);
background-repeat:repeat;
height:16px;
}

#pie {
bottom:0;
position:absolute;
height:100px;
width:100%;
}

#pie_inferior {
background-color:#4C0909;
padding: 5px 0px 5px 0px;
bottom:0;
}

#menuycuerpo{
padding-bottom:120px;

}

#cuerpo{ /*Lo que suele ser en otros diseños 'principal*/
margin-left:160px;
}

.contenedor { /*La caja que contiene texto y demases */
background-color:#004400;
border: 3px double #d0af34;
margin: 20px;
}

.texto { /*El interior de la caja contenedor*/
padding: 10px 15px 10px 15px;
}

.subtit {
color: #99FF66;
}

.importante {
font-weight:600;
}


#pie h2 {
color: #d0af34;
font-family : Georgia, Times New Roman, Times, serif;
}

#pie_inferior .elemento {
margin:20px 90px 20px 90px;
font-size:75%;
}

A:link{
color:#D0AF34;
text-decoration: none;
}

A:active{
color:#D0AF34;
text-decoration: none;
}

A:visited{
color:#D0AF34;
text-decoration: none;
}

A:hover{
color:#8A8AFF;
text-decoration: none;
}

.contenedor h2 {
color:#d0af34;
background-color:#4c0909;
border-bottom:3px double #d0af34;
margin: 0px;
padding: 5px 15px 5px 15px;
text-transform:uppercase;
font-family:felix titling, georgia, times new roman, times, serif;
text-align:center;
}

.contenedor h4 {
color:#d0af34;
font-family:felix titling, georgia, times new roman, times, serif;
}

.proximo {
margin:40px 60px 40px 60px;
font-style:italic;
}

p {
margin:12px 0px 12px 0px;
}

li {
margin:12px 0px 12px 0px;
}

.gallerytitle {
color:#d0af34;
font-family:felix titling, georgia, times new roman, times, serif;
font-size:120%;
}

/* ESTILO DEL MENU */

.menu {background-image:url(imagenes/menu/fondo.gif);}

.menu img {border:0px; margin-bottom:-4px; padding:0px;}

table {border-collapse:collapse; border:0; margin:0; padding:0;}

.menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
.menu ul li a:hover ul li a.hide {display:none;}

.menu ul li a:hover {color:#fff;
background-image:url(imagenes/menu/fondo.gif); background-color:#b3ab79;}
.menu ul li a:hover ul {display:block; position:absolute; top:0; left:147px;
width:150px;}
.menu ul li a:hover ul li a.sub {background:#dfc184; color:#000;}
.menu ul li a:hover ul li a {display:block; background:#b3ab79; color:#fff;
width:150px;}
.menu ul li a:hover ul li a ul {visibility:hidden;}
.menu ul li a:hover ul li a:hover {background:#dfc184; color:#000;}
.menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute;
left:151px; top:0; color:#000;}
.menu ul li a:hover ul li a:hover ul li a {display:block; width:200px;
background:#dfc184; color:#000;}
.menu ul li a:hover ul li a:hover ul li a:hover {background:#bd8d5e;
color:#fff;}






-- 

Nidia Fernández Martínez
Alhana, Alhanita, Nahriah...
http://alhanita.blogspot.com

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


[Ovillo] Estructuracion de CSS

2006-09-02 Por tema Nidia Fernandez Martinez
Hola,

Hasta ahora mis encuentros con CSS se han limitado a páginas individuales
(un par de blogs al que cambiar la plantilla, una página personal con mis
datos, etc). En breve me voy a enfrentar al reto de poner un poco al día un
sitio web completo, y pasar de HTML y tablas a CSS. El sitio en cuestión se
divide en varios sub-sitios independientes, pero con estilos similares. Es
decir, que las diferencias principales serán en cuanto a colores de fondo y
colores de algunos elementos. Y cada sub-sitio es como un sitio web
completo, con sus secciones. Habrá secciones de estructura similar, y otras
en las que cambie.

La cuestión es: ¿cómo creeis que es la mejor manera de organizar las CSS? Un
archivo CSS en el raíz lo veo casi imposible porque a la larga tendría
muchás cosas casi duplicadas, y un archivo para documento HTMl es
completamente ineficiente.

Perdón si la pregunta es de novata total, pero es que realmente soy una
novata total. No ando buscando tanto una 'respuesta google' única como oir
la opinión de varias personas y poder tratar del tema.

Muchas gracias, y un saludo.

-- 

Nidia Fernández Martínez
Alhana, Alhanita, Nahriah...
http://alhanita.blogspot.com

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://ovillo.org/mailman/listinfo/ovillo