Problèmes avec figure et figcaption ?

Bonjour à tous,

Ici vous trouverez la nouvelle version d'un site Internet que je suis en train de refaire.

Au niveau de la sémantique, je pense que c'est pas trop mal (mais n'hésité pas à me pointer du doigt les erreurs ou oublis).

Pour en venir à mon problème, j'utilise le framework Foundation. Au niveau des possibilités offertes par celui-ci j'ai mis en place des dropdown et des reveal.

Si vous regardez le code HTML, j'ai un commentaire DROPDOWN SECTION où en dessous de celui-ci, chaque élément commence par une balise Section. J'aurais aimer encadrer le tout avec une balise Article, pour rester dans la logique du reste du code et bien faire une séparation sémantique. Si je fais cela, plus aucune dropdown ne fonctionne. Si je remplace article par div, ça fonctionne...

Autre problème mais même source, le premier dropdown est utilisé pour afficher une carte bing. Je laisse mon code avec la balise Figure mais idem, avec div ça fonctionne. Donc du à cette balise, je me retrouve avec des bandes blanches sur la carte.

J'ai aussi un commentaire MODAL SECTION, même chose, si j'encadre le tout avec Article, plus rien ne fonctionne.

Que me conseillez vous de faire ? Ma sémantique est-elle correcte ? Dois-je passer de figure à div (du coup je vois pas trop l'intérêt) ou éliminer complètement ces balises ? Existe t'il des astuces ou autres ? J'ai regardé un article sur ce site, rien est dit sur ce sujet et elles sont pourtant reconnus depuis longtemps.

Merci pour votre aide.

Personne ne comprends se que j'explique ou personne ne sais quoi faire ?

Le fait que cela ne fonctionne plus si tu changes de balise ne viendrait-il pas simplement du sélecteur utilisé côté JavaScript pour la gestion du dropdown ?

Alors c'est une excellente question que j'aurais pu détailler

J'ai ceci :

<a href="#" data-dropdown="drop-novy-bor-image-2" class="large"></a>

Le data-dropdown appel un "id", donc ici c'est bien cette section qui est appelée :

<section id="drop-novy-bor-image-2" class="f-dropdown content medium" data-dropdown-content></section>

Se que je ne comprends pas c'est pourquoi dans une autre balise il n'arrive pas à trouver celui-ci ? C'est toutes mes sections qui devrait être dans une balise article donc je ne peux rien signaler avec celle-ci. Quand on appel un id, peut importe son positionnement non ?

Par contre, je suis en train de regarder leur code JavaScript concernant les dropdown, pour le moment je ne vois pas trop se que je pourrais changer...

Dans l'absolu ça devrait effectivement fonctionner.

Pourquoi ne pas simplement remplacer les balises section par des balises article plutôt que d'englober chaque section dans un article ?

Attention, se n'est pas chaque section que je veux entourer de la balise article mais bien mon bloc de sections ou dis autrement ma série de blocs.

Par contre, je peux effectivement faire de mes balises section des balises article mais n'est-ce pas "moins" sémantique ?