Stop table cells from overlapping HTML CSS

Keywords: html css css-tables

Question: 

I am trying to set up a responsive table where each cell contains an image but with the code I have, the cells overlap.

Widths are set to 100% rather than fixed width so not sure why this is happening? The code that I have is below:

http://scratchpad.io/husky-breath-4275

I need the rows to not overlap when the screen is resized and the gap to not get bigger when the screen is made smaller.

Answers: