<section class="s-articles"> <ul class="l-flexTiles l-flexTiles--checkered" data-min-width="256" data-max-width="384"> <li class="l-flexTiles__item" data-index="0"> <div class="c-articleCard s-articles__card"> <a class="c-articleCard__img" href="#articleLink" target="_self" title="Article Title"> <picture class="e-picture" id="js-picture" data-dragdrop="true"> <source srcset="/fpo/128/120/" media="(max-width:32em)" /> <img src="/fpo/385/145/" alt="Alternate Text" /> </picture> </a> <div class="c-articleCard__details"> <header> <h3 class="u-h5"> <a href="#articleLink" target="_self">Article Title</a> </h3> </header> <p>Paragraph Copy</p> </div> </div> </li> <li class="l-flexTiles__item" data-index="1"> <div class="c-articleCard s-articles__card"> <a class="c-articleCard__img" href="#articleLink" target="_self" title="Article Title"> <picture class="e-picture" id="js-picture" data-dragdrop="true"> <source srcset="/fpo/128/120/" media="(max-width:32em)" /> <img src="/fpo/385/145/" alt="Alternate Text" /> </picture> </a> <div class="c-articleCard__details"> <header> <h3 class="u-h5"> <a href="#articleLink" target="_self">Article Title</a> </h3> </header> <p>Paragraph Copy</p> </div> </div> </li> <li class="l-flexTiles__item" data-index="2"> <div class="c-articleCard s-articles__card"> <a class="c-articleCard__img" href="#articleLink" target="_self" title="Article Title"> <picture class="e-picture" id="js-picture" data-dragdrop="true"> <source srcset="/fpo/128/120/" media="(max-width:32em)" /> <img src="/fpo/385/145/" alt="Alternate Text" /> </picture> </a> <div class="c-articleCard__details"> <header> <h3 class="u-h5"> <a href="#articleLink" target="_self">Article Title</a> </h3> </header> <p>Paragraph Copy</p> </div> </div> </li> <li class="l-flexTiles__item" data-index="3"> <div class="c-articleCard s-articles__card"> <a class="c-articleCard__img" href="#articleLink" target="_self" title="Article Title"> <picture class="e-picture" id="js-picture" data-dragdrop="true"> <source srcset="/fpo/128/120/" media="(max-width:32em)" /> <img src="/fpo/385/145/" alt="Alternate Text" /> </picture> </a> <div class="c-articleCard__details"> <header> <h3 class="u-h5"> <a href="#articleLink" target="_self">Article Title</a> </h3> </header> <p>Paragraph Copy</p> </div> </div> </li> </ul> </section>