flexible option: resize columns to fill container

Author: bicouy0

example-flexible/css/style.css

@@ -0,0 +1,66 @@
+
+/**
+ * Grid container
+ */
+#tiles {
+list-style-type: none;
+position: relative; /** Needed to ensure items are laid out relative to this container **/
+margin: 0 5px;
+padding: 0;
+}
+
+/**
+ * Grid items
+ */
+#tiles li {
+width: 210px;
+background-color: #ffffff;
+border: 1px solid #dedede;
+-moz-border-radius: 2px;
+-webkit-border-radius: 2px;
+border-radius: 2px;
+display: none; /** Hide items initially to avoid a flicker effect **/
+  cursor: pointer;
+padding: 4px;
+-moz-box-sizing:border-box;
+box-sizing:border-box;
+}
+
+#tiles li img {
+display: block;
+width: 100%;
+height: auto;
+}
+
+/**
+ * Grid item text
+ */
+#tiles li p {
+color: #666;
+font-size: 12px;
+margin: 7px 0 0 7px;
+}
+
+/** General page styling **/
+  
+html {
+background-color: #e9e9e9;
+}
+
+#main {
+padding: 30px 0;
+}
+
+header h1 {
+text-align: center;
+font-size: 24px;
+font-weight: normal;
+margin: 30px 0 3px 0;
+}
+
+header p {
+text-align: center;
+font-size: 13px;
+color: #777;
+margin: 0;
+}