Re: [Ovillo] eliminar pantallazo inicial al importar estilos

2007-05-10 Por tema Francisco Adolfo Álvarez Alonso
Ese problema está documentado y ocurre solo en internet explorer se 
llama Flash of Unstyled Content y tiene varias posibles soluciones

http://www.bluerobot.com/web/css/fouc.asp/ [Enlace en Inglés]

Martin Campos escribió:
 Hola.
 Prueba a utilizar el link con media=all y dentro del css, haz tantos
 @import como tipos media quieras declarar.
 Un saludo.
 
 El día 10/05/07, Karen_WmBeta [EMAIL PROTECTED] escribió:
 Hola a todos de nuevo,

 tengo el problema que cuando uso el comando @import para importar las
 hojas
 de estilo, al cargarse la página se ve momentáneamente en cueros (es
 decir, el puro html) hasta que no se carga la hoja de estilos, cosa que no
 ocurre cuando se llama al css con la etiqueta link del head.

 Alguien sabe cómo evitar este pantallazo sin estilos inicial??

 Gracias de antemano por la ayuda :)
 ___
 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

 
 
 

___
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] tablas con CSS

2007-05-03 Por tema Francisco Adolfo Álvarez Alonso
Son tres listados de anclas(Menús). Dependiendo de la relación que 
tengan yo usaría tres listas anidadas o tres listas separadas por el 
encabezado de turno.A tu gusto.
Yo lo haría así ( Cuidado puede contener trazas de inaccesibilidad o 
disconformidad del documento ).

!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN 
http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd;
html
head
title
prueba
/title
style type=text/css
#menu{
border:1px solid black;
overflow:hidden;
}
#menu .item{
display:block;
float:left;
border:1px solid red;
}
h2{
text-align:center
}
/style
/head
body
h1Menu no me puedo creer que no sea un menú/h1
ul id=menu
li class=item
h2Ciudadano/h2
ul
lia href=#Biblioteca y 
Archivo/a/li
lia href=#Catastro/a/li
lia href=#Impuestos/a/li
lia href=#Pensiones y Clases 
Pasivas/a/li
lia href=#Publicaciones/a/li
lia href=#Quejas y 
Sugerencias/a/li
lia href=#Recursos y 
Reclamaciones/a/li
lia href=#Tesoro Público/a/li
/ul
/li
li class=item
h2Administración/h2
ul
lia href=#Catastro/a/li
lia href=#Contratación Pública 
/a/li
lia href=#Coordinación Financiera 
con las Entidades
Locales/a/li
lia href=#Coordinación Financiera 
con las abbr 
title=Comunidades

AutónomasCC.AA./abbr/a/li
/ul
/li
li class=item
h2Empresas/h2
ul
lia href=#Aduanas e Impuestos 
Especiales/a/li
lia href=#Comisión Nacional del 
Mercado de Valores/a/li
lia href=#Contabilidad y 
Auditoría de Cuentas/a/li
lia href=#Contratación 
Pública/a/li
lia href=#Defensa de la 
Competencia/a/li
lia href=#Impuestos/a/li
lia href=#Mercado de 
Tabacos/a/li
lia href=#Recursos y 
Reclamaciones/a/li
lia href=#Seguros y Fondos de 
Pensiones/a/li
/ul
/li
/ul
/body
/html

Javier Gomez escribió:
 por aquello de la accesibilidad, felix.
 
 (cita)
 
 Las tablas deberían utilizarse solamente para marcar la información
 tabularhttp://www.discapnet.es/web_accesible/wcag10/WAI-WEBCONTENT-19990505_es.html#tabular-information(tablas
 de datos). Los desarrolladores de contenidos deberían evitar
 usarlas para maquetar páginas (tablas de composición). Usar tablas para
 cualquier finalidad crea también especiales dificultades para los usuarios
 de lectores de 
 pantallahttp://www.discapnet.es/web_accesible/wcag10/WAI-WEBCONTENT-19990505_es.html#screen-reader(consultar
 punto
 de verificación
 10.3http://www.discapnet.es/web_accesible/wcag10/WAI-WEBCONTENT-19990505_es.html#tech-linear-tables
 ).
 
 (fin cita esta en:
 http://www.discapnet.es/web_accesible/wcag10/WAI-WEBCONTENT-19990505_es.html#gl-table-markup
 )
 
 
 debe tener forma de tabla, pero estrictamente no lo es.
 
 solo es por eso.
 
 
 
 El día 3/05/07, Félix Zapata Berlinches [EMAIL PROTECTED] escribió:
 pero, por qué no usas un tabla de html si tiene formato tabla?

 --

 *Félix Zapata Berlinches*

 Responsable Técnico

 Logotipo de Brainet

 c/ Santa María de la Cabeza nº 9,
 47012 Valladolid.
 Teléfono: 983 10 09 07
 http://www.brainet.es

 Este correo electrónico y, en su caso, cualquier fichero anexo al
 mismo, pueden contener información de carácter confidencial
 exclusivamente dirigida a la persona o entidad a la que se le envía.
 Queda 

Re: [Ovillo] display

2007-04-25 Por tema Francisco Adolfo Álvarez Alonso
laura escribió:
 hola
 
 On 4/25/07, Rodrigo Álvarez Virgós  wrote:
 Hola Laura

 Yo no metería las imágenes como elemento de la lista, no le veo mucho
 sentido. Y menos aún que por ejemplo la imagen de la Sagrada Familia sea un
 elemento de la lista, y el texto Sagrada Familia sea otro elemento
 distinto. Imagínate alguien con imágenes deshabilitadas: vería la
 información duplicada (el alt de la imagen en un li y el mismo texto en
 otro li). ¿Y alguien con CSS deshabilitado? No le encontraría sentido.
 
 si tuviera las imagenes deshabilitadas i viera la informacion doble,
 no creo q fuera un drama,lo he probado, sin embargo si lo hago con js
 i no tiene activado el js, no se veria nada de nada :(

 Y si se no se tiene css ni imagenes, pues veria un par de palabras,
 una con un enlace i la otra sin, creo que sabria salir bien parado. He
 probado a navegarla con links (navegador de texto solo), y no le veo
 problemas graves... creo que en cuanto a la accesibilidad no anda
 coja, es un tema q me preocupa, si veis algo q pueda mejorar en ese
 sentido, avisad.

Accesibilidad no es solo evitar el uso de javascript, recuerda que hay 
que aprovechar al máximo la semántica que tiene cada elemento. Usar una 
lista desordenada para imágenes es correcto (Por lo menos en este 
contexto yo considero que es así), pero recuerda que semánticamente esos 
items repetidos, no lo son. Por otro lado tienes una dirección dentro de 
un p,¿Pero a que tendría mucho más significado con un address?. 
También añadiría el atributo title de los enlaces.Son solo algunos 
consejos al ver tu código por encima.

 
 Yo metería las imágenes por separado (sin meterlas en un ul) con su
 correspondiente alt, y usaría un script en JS para el efecto que quieres
 (usar innerHTML sería una buena opción). Este script no sería intrusivo y la
 semántica de tu documento HTML sería mucho más coherente.
 
 Nose, js no es un lenguaje que domine... y tampoco me acaba de
 convencer, en la pagina de css donde saqué la idea no hay nada hecho
 en css y ahi estan.
 

En este caso el que aparezca la imagen en la mitad al pasar el ratón por 
encima podría considerarse un valor añadido,si se puede hacer todo con 
css perfecto, pero aquí un javascript bien hecho no desencajaría.

 He encontrado el original, http://www.cssplay.co.uk/menu/gallery4.html
 por supuesto está mucho mejor hecho q el mio :)
 
 Creo que en un primer momento esos li's para el texto eran span's,
 pero no me permitia mucha moviliidad del objeto, creo, tampoco lo
 recuerdo mucho, pero algo me hizo cambiar el codigo. En todo caso
 ahora hace lo q quiero... es grave el metodo?
 
 ciao
 
 laura
 ___
 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
 

___
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] ¡Y dale con las convenciones!

2007-04-25 Por tema Francisco Adolfo Álvarez Alonso
Almirante von Web/. escribió:
 ¡Esa es la cuestión!: ¿a+b+c = a?

Estas confundiendo las dimensiones del contenido con las del bloque de 
contención, que no es lo mismo. Repasa el modelo de caja. Te puede ser 
más o menos lógico pero es lo que hay.

 
 ¡¡¡A...!!! ¡¡¡Paren el mundo que me quiero bajar!!!
 Einstein, volvé que te perdonamos: los del W3C se tomaron la teoría de la
 relatividad como absoluta... ;-) ¡Ouch!
 
 Almirante von Web/.
 --
 Educando al asno, por no apalearlo.
 (c)2007 ;-)
 
 - Original Message -
 From: jaume op [EMAIL PROTECTED]
 To: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org
 Sent: Wednesday, April 25, 2007 11:31 AM
 Subject: Re: [Ovillo] ¡Y dale con las convenciones!
 
 
 Esta sea la cuestión.
 el consorcio dice...
 los oteadores ejecutan ?
 la gente habla.
 pero? pienso ; quiero una casa de 100m.
 Podría ser que al amueblarla se hiciera más grande?
 margin+paddding+width = width?.
 Como explicar esto, sin discursión?
 Pienso que no apota nada nuevo pero la pregunta sería, ¿ a quien hacer
 caso?
 Realmente de quien es, y quien sufre el problema?
 
 
 
 El día 24/04/07, LISTAS [EMAIL PROTECTED] escribió:
 Estoy diseñando/programando un sitio de pantalla interactiva de
 comportamiento relativo (líquido); esto es: que todo ocurre en una misma
 ventana con un IFRAME como destino y sin importar la resolución del
 monitor
 del usuario.



 El objeto en ciernes está dividido en 3 DIV alineados con la propiedad de
 posición  absolute.



 El primero, llamado columna, de 14px de ancho, está a cero píxel (0px)
 del
 margen; el segundo, llamado menú, de 125px, a 14px del margen; y el
 tercero, llamado central está a 141px y es de ancho líquido (100%) ya
 que
 se ajusta a la pantalla de usuario.



 | 14px |  125px  |  100%  |

 | Algo |  Links  | IFRAME |

 |  | ||



 Dentro del DIV central calza un IFRAME de destino.



 El código es este:



 html

 head

 titleMalditas reglas/title

 style



 .columna {

 margin: 0px; position: absolute; background: #CCFFCC; width: 14px; height:
 100%; top: 0px; left: 0px; border: solid blue 1px; padding: 1px;
 text-align:
 center; display: block;

 }



 .menu {

 margin: 0px; position: absolute; background: #CCD8E6; width: 125px;
 height:
 100%; top: 0px; left: 16px; border: solid black 1px; padding: 2px;
 display:
 block /* (none en el original) */;

 }



 .central {

 margin: 0px; position: absolute; background: #CC; width: 100%; height:
 100%; top: 0px; left: 141px; border: solid red 1px; padding: 7px;
 overflow:
 hidden; display: block;

 }



 .marco {

 -moz-border-radius:30px;

 margin: 0px; border: solid blue 2px; padding: 10px; overflow: auto; width:
 100%; height: 100%;

 }

 /style

 /head

 body

 div class=columna/div

 div class=menu/div

 div class=central

 iframe id=destino name=Destino scrolling=yes width=100%
 height=100% frameborder=0 marginwidth=20 marginheight=20
 class=marco src=central.htm

 a href=central.htm target=Destino

 Su navegador no acepta iframes/a

 /div

 /body

 /html



 Ahora bien. ¿Qué creen uds. que obtengo cuando lo visualizo todo con
 Opera,
 Explorer y Firefox? ¡Pura mierda!



 Ninguno de los 3 ven lo mismo. Hay estúpidos y absurdos desbordamientos
 en
 ancho y alto. Absurdos escalonamientos (ver al pie) de 3 objetos con los
 mismos parámetros. De modo que para corregir estos bodrios deformes tengo
 que recurrir a un truco de JavaScript que me he inventado hace añares y
 que
 emprolija todo y para todos los navegadores. Pero, ¿y por qué tengo que
 ponerle un bonete al sombrero para cubrirme del sol, si ya compré el
 sombrero?



 Pero no entiendo porqué, con tantas convenciones por allí, y el W3C en el
 medio, el perro no ladra, el gato pía y el canario caza ratones… Es como
 si
 habiendo comprado una pistola de rayos láser tenga que matar al monstruo a
 patadas.



 ¿Enojado es la palabra? Enojadísimo pues… ¡HOY ESTOY ENOJADO! Me he
 leído
 el manual de CSS2 y los proyectos del CSS3 y nada, che. Mucha teoría
 intelectual, pero en la práctica, el pescado todavía sin vender y cada
 día
 huele peor... :(



 Y después, nos quieren seguir haciendo creer que el hombre llegó a la
 luna…
 ¡Bah!



 Almirante von Web/.

 --

 Educando al asno, por no apalearlo.

 (c)2007 ;-)

 ___
 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

 ___
 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
 
 ___
 Lista de distribución 

Re: [Ovillo] Divs con esquinas redondeadas y sombras degradadas

2007-04-24 Por tema Francisco Adolfo Álvarez Alonso
Almirante von Web/. escribió:
 ¿PNG más liviano que GIF de paleta indexada? ¿Así de firme? ¡Ojo, sólo en
 algunos casos! Tengo el Photoshop delante de mis ojos y veo que me muestra
 variadito... PNG de 8 bits Vs. GIF de 8 bits... en unos casos pesa más el
 gif y en otros el png.
 
 Almirante von Web/.
 --
 Educando al asno, por no apalearlo.
 ©2007 ;-).
 
 - Original Message -
 From: Francisco Adolfo Álvarez Alonso [EMAIL PROTECTED]
 To: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org
 Sent: Thursday, April 19, 2007 11:51 AM
 Subject: Re: [Ovillo] Divs con esquinas redondeadas y sombras degradadas
 
 
 Saludos!
 
 NetVicious escribió:
 Hola Francisco,

 El jueves, 12 abr 2007 a las 09:35, escribiste:

 Tu argumentación no me convence ¿cual es la tontería exactamente? hablo
 de guardar un png con color indexado y transparencia binaria (como un
 gif) ocupando menos y haciendo uso de un formato de imagen que es
 recomendación de la w3c desde 1996.
 A  ver  si  quieres  usar un PNG trasparencia binaria con el IE6 te da
 igual que sea GIF que PNG.
 Si usas una paleta indexada para el PNG ocupa menos que GIF, así que ya
 no es igual.Además PNG es estandar y recomendación.
 PNG ocupa más que GIF normalmente por la compresión que emplea. PNG
 tiene más paleta no lo niego. GIF está más estandarizado.

 Si intentans comparar un PNG de color real con un GIF de 256 colores por
 supuesto. Pero repito, si usas una paleta indexada para el PNG ocupa
 menos que GIF.
 Personalmente para web uso generalmente GIFs y PNGs cuando la imagen
 en cuestión necesita transparencia con canal alpha fijando el fondo
 del PNG al color de fondo de la web. Si el fondo de la web no es mono
 color hay que tirar de behavios o de otros fix para los IE6 o
 inferiores.
 Perfecto, es una elección como otra cualquiera, yo solo doy una
 alternativa a gif.
 
 ___
 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
 
 ___
 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
 
Comprueba que versión de photoshop tienes, en las nuevas no se que tal
andará, pero hasta hace poco photoshop hacia una mala implementación de
la librería de compresión de PNG, metiendo además metadatos innecesarios
que hacen el fichero final más grande. Saludos.

___
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] problemas con capas

2007-04-24 Por tema Francisco Adolfo Álvarez Alonso
Roberto Barreiro escribió:
 buenos dias lista
 estoy teniendo un problema con un HTML que estoy creando (soy novato)
 tengo dos capas (div) superpuestas y visualizo uno u otro cambiandoles el
 Z-INDEX con javascript
 dentro de cada div tengo etiquetas, cajas de texto etc 
 todo funciona bien menos una cosa y ese es el motivo de este correo
 en una de las capas tengo puesto un combo desplegable, y sin importar que
 Z-INTEX tenga (me refiero a que se le coloque una capa por encima) sigo
 viendo el desplegable  es como si ese desplegable no perteneciera a esa
 capa, con lo cual el Z-INDEX no le afecta ...
 no se como solucionar esto o que es lo que estoy haciendo mal
 como dije soy novato
 les envio el codigo fuente copiado mas abajo (no coloco el javascritp ni los
 estilos)
 salu2 y gracias
 
 
 html
 head
 !--[if IE]
 LINK rel=stylesheet href=templates/css/estilos_explorer.css
 type=text/css
 ![endif]--
 
 script language=JavaScript src=javascript/funciones.js
 type=text/javascript/script
 
 /head
 !-- coloco una funcion que posicione las capas una sobre otra si tiene
 javascript activo --
 body onload=posicion('110','div_clientes,div_Contactos'); return
 false;
 
 !-- contador de zindex --
 span id=posicioninput type=hidden value=2
 name=max_posicion id=max_posicion/span/br
 
 !-- coloco un formulario --
 form name=formulario method=POST
 action=abm_cliente.php
 !-- div clientes--
 div id=div_clientes
 span class=menu_capas
 ul
 li
 a
 href=javascript:z_index('div_clientes') title=clientesClientes/a
 /li
 li
 a
 href=javascript:z_index('div_Contactos') title=ContactoContacto/a
 /li
 /ul
 /spanbr
 
 select name=SDSempresa class=pepe id=h
 option value=100 seleccione una
 opcion/option
 /select
 CCC input type=text value= name=CCC
 /div
 !-- cierro div clientes--
 
 !-- div Contactos--
 div id=div_contactos
 span class=menu_capas
 ul
 li
 a
 href=javascript:z_index('div_clientes') title=clientesClientes/a
 /li
 li
 a
 href=javascript:z_index('div_Contactos') title=ContactoContacto/a
 /li
 /ul
 /span
 input type=text value= name=contacto
 /div
 !-- cierro div contacto--
 /form
 !-- cierro formulario --
 /body
 /html
 ___
 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
 
Es preferible que dejes un enlace a un sitio publico para visualizar tu 
problema, si no es posible, por lo menos deja a disposición todos los 
ficheros.
___
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] problemas con capas

2007-04-24 Por tema Francisco Adolfo Álvarez Alonso
cmik22 escribió:
 Los combos tienen la particularidad de que siempre se ven, les pongas todas
 las capas que quieras ponerles por encima,
¿Siempre se ven?, hice un par de pruebas con el código de roberto y no 
tuve ningún problema para ocultar las capas con z-index.
 ¿por qué no pruebas a jugar con el display (none/block) o con visibility
 (visible/hidden) para ver u ocultar las capas?
 ___
 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
 

___
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] problemas con capas

2007-04-24 Por tema Francisco Adolfo Álvarez Alonso
SkuNk escribió:
 Matizando un poco la cuestión de los combos, decir que esto sólo ocurre en
 IE6 (IE7 no lo he confirmado), el que los combos se muestren por encima de
 cualquier capa, sin importar su z-index.

Ya confirmo yo que en explorer 7 no pasa. Decir que ocurre siempre (sin 
especificar navegador) me parecía una inducción a error. Gracias por la 
matización.

 La solución; ocultar los combos en el momento de mostrar las capas que vayan
 a estar por encima, ya sea con display: none o visibility: hidden.
 
 Y como ya habrás notado Francisco, en Firefox y Opera no ocurre, sólo es un
 capricho del Exploter.
 
 El día 24/04/07, Francisco Adolfo Álvarez Alonso [EMAIL PROTECTED]
 escribió:
 cmik22 escribió:
 Los combos tienen la particularidad de que siempre se ven, les pongas
 todas
 las capas que quieras ponerles por encima,
 ¿Siempre se ven?, hice un par de pruebas con el código de roberto y no
 tuve ningún problema para ocultar las capas con z-index.
 ¿por qué no pruebas a jugar con el display (none/block) o con visibility
 (visible/hidden) para ver u ocultar las capas?
 ___
 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
 ___
 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

 ___
 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
 

___
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] ¡Y dale con las convenciones!

2007-04-24 Por tema Francisco Adolfo Álvarez Alonso
LISTAS escribió:
 Estoy diseñando/programando un sitio de pantalla interactiva de
 comportamiento relativo (líquido); esto es: que todo ocurre en una misma
 ventana con un IFRAME como destino y sin importar la resolución del monitor
 del usuario. 
 
  
 
 El objeto en ciernes está dividido en 3 DIV alineados con la propiedad de
 posición  “absolute”.
 
  
 
 El primero, llamado “columna”, de 14px de ancho, está a cero píxel (0px) del
 margen; el segundo, llamado “menú”, de 125px, a 14px del margen; y el
 tercero, llamado “central” está a 141px y es de ancho líquido (100%) ya que
 se ajusta a la pantalla de usuario.
 
  
 
 | 14px |  125px  |  100%  |
 
 | Algo |  Links  | IFRAME |
 
 |  | ||
 
  
 
 Dentro del DIV “central” calza un IFRAME de destino.
 
  
 
 El código es este:
 
  
 
 html
 
 head
 
 titleMalditas reglas/title
 
 style
 
  
 
 .columna {
 
 margin: 0px; position: absolute; background: #CCFFCC; width: 14px; height:
 100%; top: 0px; left: 0px; border: solid blue 1px; padding: 1px; text-align:
 center; display: block;
 
 }
 
  
 
 .menu {
 
 margin: 0px; position: absolute; background: #CCD8E6; width: 125px; height:
 100%; top: 0px; left: 16px; border: solid black 1px; padding: 2px; display:
 block /* (none en el original) */;
 
 }
 
  
 
 .central {
 
 margin: 0px; position: absolute; background: #CC; width: 100%; height:
 100%; top: 0px; left: 141px; border: solid red 1px; padding: 7px; overflow:
 hidden; display: block;
 
 }
 
  
 
 .marco {
 
 -moz-border-radius:30px;
 
 margin: 0px; border: solid blue 2px; padding: 10px; overflow: auto; width:
 100%; height: 100%;
 
 }
 
 /style
 
 /head
 
 body
 
 div class=columna/div
 
 div class=menu/div
 
 div class=central
 
 iframe id=destino name=Destino scrolling=yes width=100%
 height=100% frameborder=0 marginwidth=20 marginheight=20
 class=marco src=central.htm
 
 a href=central.htm target=Destino 
 
 Su navegador no acepta iframes/a
 
 /div
 
 /body
 
 /html
 
  
 
 Ahora bien. ¿Qué creen uds. que obtengo cuando lo visualizo todo con Opera,
 Explorer y Firefox? ¡Pura mierda!
 
  
 
 Ninguno de los 3 “ven” lo mismo. Hay estúpidos y absurdos desbordamientos en
 ancho y alto. Absurdos escalonamientos (ver al pie) de 3 objetos con los
 mismos parámetros. De modo que para corregir estos bodrios deformes tengo
 que recurrir a un truco de JavaScript que me he inventado hace añares y que
 “emprolija” todo y para todos los navegadores. Pero, ¿y por qué tengo que
 ponerle un bonete al sombrero para cubrirme del sol, si ya compré el
 sombrero?
 
  
 
 Pero no entiendo porqué, con tantas convenciones por allí, y el W3C en el
 medio, el perro no ladra, el gato pía y el canario caza ratones… Es como si
 habiendo comprado una pistola de rayos láser tenga que matar al monstruo a
 patadas.
 
  
 
 ¿Enojado es la palabra? “Enojadísimo” pues… ¡HOY ESTOY ENOJADO! Me he leído
 el manual de CSS2 y los proyectos del CSS3 y nada, che. Mucha “teoría”
 intelectual, pero “en la práctica”, el pescado todavía sin vender y cada día
 huele peor... :(
 
  
 
 Y después, nos quieren seguir haciendo creer que el hombre llegó a la luna…
 ¡Bah!
 
  
 
 Almirante von Web/.
 
 --
 
 Educando al asno, por no apalearlo.
 
 ©2007 ;-)
 
 ___
 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
 
  Entiendo que estés enojado por la interpretación tan diversa que hay. 
De todas formas revisa la especificación (Computando alturas y márgenes) 
, así de primeras veo que aplicas padding teniendo definido un height 
(100%), este se va a sumar al espacio en vertical que ocupa el 
elemento(de ahí tus escalones sin sentido)Si me equivoco que alguien 
me corrija please.
___
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] Divs con esquinas redondeadas y sombras degradadas

2007-04-20 Por tema Francisco Adolfo Álvarez Alonso
Saludos!

NetVicious escribió:
 Hola Francisco,
 
 El jueves, 12 abr 2007 a las 09:35, escribiste:
 
 Tu argumentación no me convence ¿cual es la tontería exactamente? hablo
 de guardar un png con color indexado y transparencia binaria (como un 
 gif) ocupando menos y haciendo uso de un formato de imagen que es 
 recomendación de la w3c desde 1996.
 
 A  ver  si  quieres  usar un PNG trasparencia binaria con el IE6 te da
 igual que sea GIF que PNG.
Si usas una paleta indexada para el PNG ocupa menos que GIF, así que ya 
no es igual.Además PNG es estandar y recomendación.
 
 PNG ocupa más que GIF normalmente por la compresión que emplea. PNG
 tiene más paleta no lo niego. GIF está más estandarizado.
 
Si intentans comparar un PNG de color real con un GIF de 256 colores por 
supuesto. Pero repito, si usas una paleta indexada para el PNG ocupa 
menos que GIF.
 Personalmente para web uso generalmente GIFs y PNGs cuando la imagen
 en cuestión necesita transparencia con canal alpha fijando el fondo
 del PNG al color de fondo de la web. Si el fondo de la web no es mono
 color hay que tirar de behavios o de otros fix para los IE6 o
 inferiores.
Perfecto, es una elección como otra cualquiera, yo solo doy una 
alternativa a gif.

___
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] Divs con esquinas redondeadas y sombras degradadas

2007-04-13 Por tema Francisco Adolfo Álvarez Alonso
Rodrigo Galindez escribió:
 Genial la data técnica. Aclaro: GIF ya es libre, desde Octubre de  
 2006 (http://www.freesoftwaremagazine.com/node/1772)
 
 Por lo demás, en mi opinión y lamentablemente, GIF para gráficos  
 sencillos y JPG para fotografías o imágenes complejas con mucha  
 profundidad de color. Por lo menos hasta que haya una porción  
 significante de usuarios con navegadores con soporte verdadero para PNG.
 
 Rodrigo
 
 
 
 On Apr 12, 2007, at 3:46 PM, xNoleet wrote:
 
 Pregunta interesante a aclarar:

 Técnicamente:

 El formato GIF permite una paleta máxima de 256 colores, incluyendo un
 color que puede o no ser transparente. El formato PNG, posee un canal
 alfa adicional, separado de la capa de paleta de colores que permite
 usar (la cual tambien son 256 colores).

 He ahi donde radica el problema del IE en renderizar o interpretar
 un archivo PNG, no comprende la capa adicional de transparencia.

 Socio-Economicamente:

 El formato GIF (Graphic Interchange Format) fue patentado y ahora las
 aplicaciones que exportan o permiten el uso de este formato, deben
 pagar una cuota. El formato PNG nacio como una iniciativa
 Open-Source, y se pueden obtener resultados similares al GIF.

 Esa es una explicación breve y muy recortada, pero espero aclare las
 dudas mas básicas, si desean saber mas, preguntar a Don Google, el
 sabe mucho mas :).

 Pz.


 -- 
 xNoleet ][ freelance graphic designer  artist ]

 http://www.dojohabit.com ][ Dôjo ]
 http://www.luser-co.com ][ Lüser - Tees de diseño x Fuck Fashion! ]
 http://vm.dojohabit.com ][ personal portfolio ]
 http://h3x.dojohabit.com ][ experimental project ]
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a [EMAIL PROTECTED]
 Puedes modificar tus datos o desuscribirte en la siguiente  
 dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
 
 Rodrigo Galindez
 [EMAIL PROTECTED]
 http://www.16bits.net
 NEW! E-mail to my mobile: [EMAIL PROTECTED]
 
 
 
 ___
 Lista de distribución Ovillo
 Para escribir a la lista, envia un correo a [EMAIL PROTECTED]
 Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
 http://lists.ovillo.org/mailman/listinfo/ovillo
 
Vamos por partes:
  Por un lado tenemos JPEG que es un formato de imagen con compresión 
con pérdida en favor del peso del fichero perfecto para imágenes con 
mucho cambio de color (lease fotografía). Si queremos que este tipo de 
imágenes pese poco y sean de un tamaño considerable este es el formato a 
usar.

  Por el otro esta GIF que es un formato de imagen con paleta indexada 
con 8 bits de profundidad por píxel con soporte para transparecia binaria.

  Para continuar esta PNG que es un formato de imagen con compresión SIN 
PERDIDA. con soporte de hasta 3 canales (de hasta 16 bits) y uno 
adicional Alpha podemos una imagen de 64 bits totales por píxel.

Aquí es donde está el problema, PNG no hace una compresión con pérdida a 
favor del peso de la imagen y no llega al nivel de compresión de JPEG.
Y por otro lado GIF tiene mejor compresión que JPEG para imágenes con 
pocas variaciones de color (colores planos ..) y encima soporte de 
transparencia (cosa que JPEG no tiene).

Si comprimimos una imágen con pocas variaciones de color en PNG de 4 
canales (de hasta 64 bits por píxel) nunca va a pesar menos que en 
formato GIF (8 bits por píxel).

Yo hablo de cojer el PNG y el programa de tratamiento de imágenes de 
turno e indexar la paleta de colores (de 8bits) para ponerlo a la misma 
altura (a numero de bits por píxel). Podeis probarlo, además PNG tiene 
mejor nivel de compresión (Pesan menos que los GIF).

Solo estoy dando una solución a los que quieren hacer uso de las 
recomendaciones de la W3C, tener ficheros menos pesados, y una 
explicación de por qué explorer 6 no soporta el canal alpha y su 
solución alternativa. El que quiera seguir usando GIF está en su derecho 
(además ya es libre). Yo por mi parte ya tengo un sustito mejor que GIF. 
Saludos a todos.
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [EMAIL PROTECTED]
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Divs con esquinas redondeadas y sombras degradadas

2007-04-12 Por tema Francisco Adolfo Álvarez Alonso
NetVicious escribió:
 Hola Francisco,
 
 El miércoles, 11 abr 2007 a las 12:34, escribiste:
 
 Explorer 6 por el contrario de lo que se piensa SI soporta png 
 transparentes, eso si tiene que ser transparencia binaria y no a través
 del canal alfa
 
 Para eso usas un GIF y te dejas de tonterías ;-)
 
Tu argumentación no me convence ¿cual es la tontería exactamente? hablo 
de guardar un png con color indexado y transparencia binaria (como un 
gif) ocupando menos y haciendo uso de un formato de imagen que es 
recomendación de la w3c desde 1996.
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [EMAIL PROTECTED]
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo


Re: [Ovillo] Divs con esquinas redondeadas y sombras degradadas

2007-04-11 Por tema Francisco Adolfo Álvarez Alonso
Ainhoa Martín Rosas escribió:
 Hola a todos. Gracias por las respuestas. Dentro de mis divs hay tanto texto
 como imágenes. Efectivamente prefiero no poner flash y bueno, podría hacerlo
 como toda la vida, metiendo las esquinas y degradados como imágenes en el
 fondo, pero es que digo yo que habrá una forma más ortodoxa de hacerlo ¿no?
 (si son estética, debería poder hacerse con css).
 
 ¿Lo de los pngs qué problema dá en Explorer6? (perdonad mi ignorancia, yo sé
 que en Explorer no se ven los pngs transparentes pero nada más).
 
Hola a toda la lista:

Explorer 6 por el contrario de lo que se piensa SI soporta png 
transparentes, eso si tiene que ser transparencia binaria y no a través 
del canal alfa (de 8 bits) que es el que no soporta explorer 6 y nos da 
ese encantador color gris. La causa de que lo soporte el canal alfa 
explorer 6 es porque la especificación de PNG la considera optativa. No 
podrás hacer maravillas orientales con trasparencias pero los casos 
básicos los tendrás resueltos.

 
 El día 11/04/07, laura [EMAIL PROTECTED] escribió:
 hola
 El mejor que he visto y utilizando una sóla imagen es este:
 http://www.schillmania.com/projects/dialog2/

 Con sombra incluida y todo. Es un PNG con todo lo que ello conlleva
 para IE6. En el firefox abajo a la derecha salen dos iconitos para que
 veas como traga el cambio de fondo y el ajuste de tamaño de los divs.

 Pero si navegas sin imagenes que se verá? , aparte de la carga de
 bajar una imagen tan grande, no me convence este metodo, aunque se ve
 el mas limpio de codigo. Hay alguno que funcione 100% ?


 ciao!
 ___
 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

 
 
 

___
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