¿Cómo se puede hacer clic en el área de un div? No todo el div!

Question

Si tiene una imagen de fondo en un div con un botón (dibujado) en el centro y algunos otros dibujos a su alrededor. ¿Cómo se puede hacer clic en el botón pero no en todo el div porque no quiero que el usuario haga clic en los dibujos a su alrededor, si tiene sentido? ¿Estoy perdiendo el tiempo jugando con relleno y márgenes? ¿Debo simplemente crear dos divs? Mi jefe dice que ha logrado hacerlo usando un div antes.

Cheers

Answer 1

Deja un elemento que es transparente y relativamente colocado dentro de la div. Colóquelo en la parte superior del botón y hágalo del mismo tamaño que el botón. Haga que el elemento haga clic en capaz.

Answer 2

En resumen, no es así.

Los fondos son fondos. Ellos no están contentos. No son interactivos.

Es posible que cortar alrededor, pero que no debería. Si tiene algún contenido para que el usuario interactúe, entonces preséntelo como contenido. Use un <img>.

Answer 3

Se podría hacer el div "position: relative" y luego colocar una etiqueta A < > en el dibujo utilizando

display: block; 
width: your_width; 
height: your_height; 
position: absolute; 
left: your_position_x; 
top: your_position_y; 

Esa sería la manera más limpia.

Answer 4

probar este código:

#container { width:200px; height:100px; position:relative } 
#clicker { display:block; width:20px; height:10px; position:absolute; top:20px; left:100px; } 

<div id="container"> 
    <a id="clicker" href="#link"></a> 
</div> 

cambiar Obviamente todas las dimensiones para que coincida con el área que desea hacer se puede hacer clic.