Designer News is where the design community meets.
5 years ago from Will Almendras, Front-end Web Developer
What do you mean sprite style? You could use purecss' grid to do 3, 1/3 1/3 1/3, rows. Then give the corresponding places the right images and you are done.
<div class="pure-g"> <div class="pure-u-1-3"><p>image</p></div> <div class="pure-u-1-3"><p> </p></div> <div class="pure-u-1-3"><p>image</p></div> <div class="pure-u-1-3"><p> </p></div> <div class="pure-u-1-3"><p>image</p></div> <div class="pure-u-1-3"><p> </p></div> <div class="pure-u-1-3"><p>image</p></div> <div class="pure-u-1-3"><p> </p></div> <div class="pure-u-1-3"><p>image</p></div> </div>
When using the responsive grid, just add a no-mobile to the empty divs and you are done.
Now playing
What do you mean sprite style? You could use purecss' grid to do 3, 1/3 1/3 1/3, rows. Then give the corresponding places the right images and you are done.
<div class="pure-g"> <div class="pure-u-1-3"><p>image</p></div> <div class="pure-u-1-3"><p> </p></div> <div class="pure-u-1-3"><p>image</p></div> <div class="pure-u-1-3"><p> </p></div> <div class="pure-u-1-3"><p>image</p></div> <div class="pure-u-1-3"><p> </p></div> <div class="pure-u-1-3"><p>image</p></div> <div class="pure-u-1-3"><p> </p></div> <div class="pure-u-1-3"><p>image</p></div> </div>When using the responsive grid, just add a no-mobile to the empty divs and you are done.