<a href='index.html'><div class="logo"></div></a>
Los div son elementos de bloque en (x)html y no pueden ir dentro de los <a>, que son elementos en linea. Eso es un fallo grave sintactico que te puede dar problemas en el CSS y en el DOM a parte de una validacion negativa del codigo (x)html.
Usa una etiqueta <span> en vez del div, y luego si quieres le das un comportamiento block al span en el CSS (block e inline en CSS no son lo mismo que en (x)html), en CSS todo elemento puede ser block o inline (posicionalmente) pero en xhtml no, por defecto tienen el mismo comportamiento que en xhtml pero se puede cambiar.
Por ejemplo <span> es un elemento en linea de (x)html, y siempre sera en linea en el (x)html, por lo tanto se puede colocar dentro de otro elemento en linea como <a>. Sin embargo en CSS span puede mostrarse en linea o en bloque, por defecto sera mostrado en linea (como en (x)html) pero se puede cambiar.
En cuanto a tu problema si lo he entendido bien quieres poder hacer clic en una imagen de fondo a modo de enlace.. lo que no se es como has conseguido hacer eso en algun navegador ya que las imagenes de fondo CSS no son interactivas, para que una imagen pueda ser clickeada es necesario que este puesta mediante <img> en el codigo fuente del (x)html. Creo que debe estar relacionado con el fallo del codigo que has puesto que de alguna manera extraña activa tu div como si fuera un enlace en algunos navegadores.
Quizas la manera mas sencilla de hacer lo que tu quieres si he entendido bien lo que quieres hacer seria;
<div>
<a href="#"><img src="#" alt="logo" /></a>
</div>
Tambien como te han dicho antes podrias aplicar a la etiqueta <a> todo el CSS, pero un logo en mi opinion sobrepasa en significado a un elemento decorativo (imagenes de fondo), por lo tanto es mas adecuado usar img en el codigo (x) html para mostrarlo.