[CSS] Application (non souhaitée) d'un effet au parent via :not(:hover)

Bien le bonjour!

Petite question concernant l'utilisation du :nothover) :

Voici un exemple, ce sera plus simple pour illustrer mes propos : http://www.css3create.com/Effets-de-survol-avec-transitions-et-filtres-CSS

Je souhaiterai savoir s'il y avait une astuce pour que, lorsque l'on met la souris sur l'espace (le "parent") situé entre les miniatures, l'effet (ici, le flou et niveau de gris) ne soit pas appliqué à toutes les miniatures.

L'espace est certes petit mais, dans l'utilisation que j'en fais sur une page, celui-ci est plus important et donc la souris peut se placer aisément entre les miniatures et appliquer l'effet à toutes

Merci de votre aide.

 

Merci pour ta réponse

Malheureusement, le problème sera identique : on met la souris ( :hover ) sur le parent (donc le ul), qui englobe les li, les images, et les marges des li/images.

J'ai quand même testé, au cas où, mais ça ne fonctionne pas

 

C'est tout bon !

J'avoues que, pendant un moment, je me suis tourné vers Javascript/jQuery (avec mouseover/mouseout, this.id, .not, .className +=, etc...), ça fonctionnait très bien... 'pis j'me suis dit que j'avais un peu sorti le char d'assaut pour rien... J'ai "réétudié" le html/css et, en gros, comme ma structure correspondait à peu près à ça (pour faire simple) :

HTML:

<div class="container">
    <a class="liens" href="" title="">
        <img class="miniatures" src="" alt="">
        <h5>...</h5>
    </a>
</div>

J'ai juste joué sur le padding du a, pour faire une marge à l'intérieur des div .container.

Du coup, il y a bien des espaces blancs entre les miniatures mais ceux-ci correspondent à un élément (aux .liens) et non plus à "rien".

Bref, j'ai encore cherché beaaaaucoup trop compliqué pour pas grand chose...