Des textes qui ne correspondent pas aux photos dans ma page !

Bonjour à tous,
J'ai une galerie qui affichait les textes des photos sans problème.
Mais depuis une mauvaise manip (?), la légende 1 correspond à la photo 1, la photo 2 se retrouve avec la légende 1, pareil pour la photo 3 etc... parfois le texte saute, l'interlignage ne correspond pas aux css (les textes se chevauchent). AU SECOURS !!! :calim2: :calim2: :calim2: :calim2: :calim2: :calim2:
Un exemple du html :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
          <div class="grid__item" data-size="1280x1066">
            <figure> <a href="img/original/will_eisner.jpg" class="img-wrap"><img src="img/thumbs/will_eisner_thumb.jpg" alt="Will Eisner" /></a>
              <figcaption><strong>Will Eisner</strong></figcaption>
            </figure>
            <div class="description description--grid">
              <h1><strong>Will Eisner</strong></h1>
              <p>Faire-part de naissance</p>
              <div class="details">
                <ul>
                  <li>
                    <h2><i class="fa fa-expand"></i><span>16x17 </span></h2>
                  </li>
                  <li>
                    <h2><i class="fa fa-comment-o"></i><span>Morbi tortor. In porta tortor non sapien vulputate imperdiet. Aliquam eget eros id turpis volutpat ornare. Pellentesque luctus malesuada turpis. Nam non diam at pede accumsan imperdiet. Sed lacinia mi et lacus. Praesent a sem. Suspendisse nisl lorem, consequat vel, mattis ac, placerat a, justo. Vestibulum volutpat eros sit amet felis. Proin vel ante et orci convallis suscipit. Donec sem augue, fringilla eget, hendrerit ac, porta a, ipsum.</span></h2>
                  </li>
                </ul>
              </div>
             </div>
          </div>
          <div class="grid__item" data-size="1160x709">
            <figure> <a href="img/original/jeangiraud.jpg" class="img-wrap"><img src="img/thumbs/jeangiraud_thumb.jpg" alt="Jean Giraud" /></a>
              <figcaption><strong>Jean Giraud</strong></figcaption>
            </figure>
            <div class="description description--grid">
              <h1><strong>Jean Giraud</strong></h1>
              <p>Faire-part de baptême</p>
              <div class="details">
                <ul>
                  <li>
                    <h2><i class="fa fa-expand"></i><span>16x17 cm</span> </h2>
                  </li>
                  <li>
                    <h2><i class="fa fa-comment-o"></i><span>Morbi tortor. In porta tortor non sapien vulputate imperdiet. Aliquam eget eros id turpis volutpat ornare. Pellentesque luctus malesuada turpis. Nam non diam at pede accumsan imperdiet. Sed lacinia mi et lacus. Praesent a sem. Suspendisse nisl lorem, consequat vel, mattis ac, placerat a, justo. Vestibulum volutpat eros sit amet felis. Proin vel ante et orci convallis suscipit. Donec sem augue, fringilla eget, hendrerit ac, porta a, ipsum.</span></h2>
                  </li>
                </ul>
              </div>
              </div>
          </div>

j'ai remis la page en ligne :
http://impactetroit.com/dedicaces.html
Merci pour votre aide,
dh