移动设备的响应式设计

Question

我目前正在建立一个响应迅速的移动网站，但我正在努力完成最后一部分，我希望图像分为2或3列。 -webkit-column-count float left没有用。

以下是html代码：

<div id="photos"> 
    <span>Some copy should <br> go here</span>
    <a href="#"> 
        <img class="hexagon-link-one" src="http://placekitten.com/500/300" alt="">
    </a>
</div>

<div id="photos">    
    <span class="typetwo">Some copy should <br> go here</span>
    <a href="#"> 
       <img class="hexagon-link-two" src="http://placekitten.com/500/300" alt="">                 
    </a>    
</div>  

<div id="photos">        
    <span>Some copy should <br> go here</span>
    <a href="#"> 
       <img class="hexagon-link-one" src="http://placekitten.com/500/300" alt="">                 
    </a>    
</div>  

<div id="photos">       
    <span>Some copy should <br> go here</span>
    <a href="#"> 
        <img class="hexagon-link-one" src="http://placekitten.com/500/300" alt="">                   
    </a>    
</div>

其余部分位于以下链接中。

http://jsfiddle.net/4QXkk/

非常感谢任何帮助。

非常感谢

的Dom