Snippets

Daniel Sokolowski Light column gird system

Updated by Daniel Sokolowski

File light-column-gird-system Modified

  • Ignore whitespace
  • Hide word diff
 DS,2016-Apr-26: more testing for below is needed, but if it is too aggresive in your existing style comment it out and use `.column-wrapper`
 DS,2106-Apr-27-0135: changed to `visible` as popup menus fail to show
 DS,2106-Apr-27-0138: since we should always use column-wrapper to clear columns we might as well avoid the below css
-DS,2106-Apr-27-0152: `visible` causes elements with itesm bigger then 100% to create a horziontal scroll bar 
+DS,2106-Apr-27-0152: `visible` causes elements with items bigger then 100% to create a horziontal scroll bar 
 */
-
 /*body * {
     overflow: visible;
 }*/
 
-/* use this class to make parent 'wrap' our floated columns and clear our column rows */
+/* use this class to make parent 'wrap' our floated columns and clear the column rows */
 .column-wrapper {
     overflow: hidden;
     clear: both;
     width: 100%
 }
 
-
-.heroBannerTEMP {
-    max-height: 730px; /* video full height on 1920x1080 monitor */
-}
-
-.heroBannerTEMP .heroBannerBackgroundWrapper {
-    position: absolute;
-}
Updated by Daniel Sokolowski

File light-column-gird-system Modified

  • Ignore whitespace
  • Hide word diff
 * Light Column Grid v2016-apr-25
 * ##############################
 *
-* See: https://bitbucket.org/snippets/danielsokolowski/d68x/simple-wrapperless-column-gird-system
+* See: https://bitbucket.org/snippets/danielsokolowski/d68x/light-column-gird-system
 *
 * Example:
 *
Updated by Daniel Sokolowski

File light-column-gird-system Modified

  • Ignore whitespace
  • Hide word diff
 * ======================================================
 */
 
-/* 
-DS,2016-Apr-26: more testing for below is needed, but if it is too aggresive in your existing style comment it out and use `.column-wrapper` 
-DS,2106-Apr-27-0135: changed to `visible` as popup menus fail to show 
-DS,2106-Apr-27-0138: since we should always use column-wrapper to clear columns we might as well avoid the below css 
+/*
+DS,2016-Apr-26: more testing for below is needed, but if it is too aggresive in your existing style comment it out and use `.column-wrapper`
+DS,2106-Apr-27-0135: changed to `visible` as popup menus fail to show
+DS,2106-Apr-27-0138: since we should always use column-wrapper to clear columns we might as well avoid the below css
+DS,2106-Apr-27-0152: `visible` causes elements with itesm bigger then 100% to create a horziontal scroll bar 
 */
+
 /*body * {
     overflow: visible;
 }*/
 
 /* use this class to make parent 'wrap' our floated columns and clear our column rows */
 .column-wrapper {
-    overflow: visible;
+    overflow: hidden;
     clear: both;
 }
 
 
+
 /*
 * The 12 column based grid
 *
Updated by Daniel Sokolowski

File light-column-gird-system Modified

  • Ignore whitespace
  • Hide word diff
 * ======================================================
 */
 
-/* DS,2016-Apr-26: more testing for below is needed, but if it is too aggresive in your existing style comment it out and use `.floatWrapFix` */
+/* 
+DS,2016-Apr-26: more testing for below is needed, but if it is too aggresive in your existing style comment it out and use `.column-wrapper` 
+DS,2106-Apr-27-0135: changed to `visible` as popup menus fail to show 
+DS,2106-Apr-27-0138: since we should always use column-wrapper to clear columns we might as well avoid the below css 
+*/
 /*body * {
-    overflow: hidden;
+    overflow: visible;
 }*/
-/* use this class to make parent 'wrap' our floated columns */
+
+/* use this class to make parent 'wrap' our floated columns and clear our column rows */
 .column-wrapper {
-    overflow: auto;
+    overflow: visible;
     clear: both;
 }
 
 
 .width-12\/12 {
     width: 100%
+}
+
+
+.heroBannerTEMP {
+    max-height: 730px; /* video full height on 1920x1080 monitor */
+}
+
+.heroBannerTEMP .heroBannerBackgroundWrapper {
+    position: absolute;
 }
Updated by Daniel Sokolowski

File light-column-gird-system Modified

  • Ignore whitespace
  • Hide word diff
 /* use this class to make parent 'wrap' our floated columns */
 .column-wrapper {
     overflow: auto;
+    clear: both;
 }
 
 
  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
HTTPS SSH

You can clone a snippet to your computer for local editing. Learn more.