title: HTML/CSS - Floating images based on browser size
body: <p>I'm trying to create a HTML5 app with cross-browser compatibility - ideally for mobiles. I'm using HTML5/CSS3/JavaScript/jQuery(with mobile). </p>
  
  <p>My homepage needs to be six square buttons(images) that are centered to the page, so if you imagine a mobile screen with two columns, three squares in each, in the center. </p>
  
  <p>I was hoping someone with more experience might be able to guide me to which is the best way to tackle this problem? It would be cool if the screen was turned horizontally that the images would float into 3 columns of 2. </p>
  
  <p>If anyone has any ideas I'd very much appreciate it. I apologize that my description is a bit brief but I haven't wrote the code just yet, I wanted to see what people thought first of all. Thanks. </p>