how do i design a layout like this using css with sprite style in each image on the box?

5 years ago from Will Almendras, Front-end Web Developer

how do i design a layout like this using css with sprite style in each image on the box? https://www.dropbox.com/s/20kbugs89hl08bi/position.jpg?dl=0

1 comment

Sem Schilder, 5 years ago (edited 5 years ago )
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.
0 points

Now playing