Archive for the 'Html' Category

Con este nombre críptico se esconde uno de mis quebraderos de cabeza que estoy teniendo para maquetar de forma que Internet Explorer 6, 7 y Firefox trabajen de la misma forma.

Imaginemos que tenemos un div que contiene un par de divs con float:left. El problema que nos aparece es que el fondo gris no se estira para recoger los elementos que contiene, ya que los divs internos son flotantes.

HTML:
<div style="background-color: grey;">
  <div style="float: left;">
    <img src="images/avatar.jpg">
  </div>
  <div style="float: left;">
    Nombre del Usuario
  </div>
</div>

Como corregimos ésto? Bién, he dado con la solución!

BuscarA veces se hace necesario realizar una búsqueda sobre el texto mostrado por pantalla. En esta situación, No hay query de SQL que valga, ni procesos PHP, porque la página ya está generada y cargada en el navegador del cliente. Me interesaba realizar un sistema de búsqueda dónde el cliente, una vez cargada la página, pudiera buscar algo ahí sin recargar nada.

Estuve buscando una forma de solucionarlo y caí en una página que utiliza un conjunto de funciones Javascript que presenta una ventana de tipo prompt, realiza una búsqueda sobre lo mostrado en la página y resalta en un color específico las coincidencias.

A continuación posteo el código y lo comento un poco.

Firerfox vs. Internet ExplorerPara un proyecto del trabajo me veo submergido en la creación dinámica de el contenido de una página web. Para realizar este trabajo, me decanté a trabajar con DOM accediendo via Javascript. Sé que existen librerías muy completas crossbrowser que realizan fácilmente el trabajo requerido, soltando código compatible para (casi) todos los navegadores, pero yo soy de ésos que prefiere jugar a un nivel más bajo (siempre que no se me compliquen las cosas en exceso).

Sabiendo que Firefox respeta mejor los estándares que Internet Explorer, llevo ya la costumbre de desarrollar para Firefox y luego adecuar el código para que funcione para Internet Explorer... pero esta vez la cosa se me ha ido de las manos...

He encontrado varios problemas relacionados con las diferencias en que el DOM es tratado por ambos navegadores, con lo que he podido observar con mis propios ojos que no siempre Firefox respeta el estándar o que la forma de trabajar de Internet Explorer acaba siendo muy sui-generis.

En este artículo presento un ejemplo básico: una página con un DIV que sirve como base para que un código Javascript monte una tabla "modelo" mediante DOM, para ilustrar las diferencias que he encontrado.