HTML POSICIÓN DE CAPAS

¿Por qué no se me posiciona donde quiero una CAPA?
¿Por qué al abrir la barra lateral de Favoritos/Marcadores la capa se desplaza?
¿Por qué al cambiar de resolución, cambia de sitio?

La respuesta es fácil. Las capas absolutas (style=»position:absolute;») tienen sus valores top y left con respecto a su contenedor principal. Si la capa está en una tabla o en body directamente, pues estos son sus contenedores.

¿Cómo hacer que una capa esté siempre en el mismo sitio?

Mi consejo es utilizar una capa relativa (style=»position:relative;») y dentro anidarle una absoluta.

¿Ejemplos?

<table>
<tr>
<td width=»33%»>¿Y la capa?</td>
<td>
<div style=»position:relative;»>
<div style=»position:absolute;top:3px;left:10px;»>
¡Aquí estoy!
</div>
</div>
</td>
</tr>
</table>

¿Y la capa?

¡Aquí estoy!