diff --git a/css/structure/jquery.mobile.grid.css b/css/structure/jquery.mobile.grid.css index 39a3850a3e2..f938d6019fb 100644 --- a/css/structure/jquery.mobile.grid.css +++ b/css/structure/jquery.mobile.grid.css @@ -1,22 +1,24 @@ /* content configurations. */ .ui-grid-a, .ui-grid-b, .ui-grid-c, .ui-grid-d { overflow: hidden; } -.ui-block-a, .ui-block-b, .ui-block-c, .ui-block-d, .ui-block-e { margin: 0; padding: 0; border: 0; float: left; min-height:1px;} +.ui-block-a, .ui-block-b, .ui-block-c, .ui-block-d, .ui-block-e { margin: 0; padding: 0; border: 0; float: left; min-height:1px; } /* grid solo: 100 - single item fallback */ -.ui-grid-solo .ui-block-a { width: 100%; float: none; } - +.ui-grid-solo .ui-block-a { display: block; float: none; } +/* Lower percentages for older browsers (i.e. IE7) to prevent wrapping */ /* grid a: 50/50 */ -.ui-grid-a .ui-block-a, .ui-grid-a .ui-block-b { width: 50%; } +.ui-grid-a .ui-block-a, .ui-grid-a .ui-block-b { width: 49.955%; } +/* -.5px to fix BB5 wrap issue. */ +.ui-grid-a > :nth-child(n) { width: 50%; margin-right: -.5px; } .ui-grid-a .ui-block-a { clear: left; } - /* grid b: 33/33/33 */ -.ui-grid-b .ui-block-a, .ui-grid-b .ui-block-b, .ui-grid-b .ui-block-c { width: 33.333%; } +.ui-grid-b .ui-block-a, .ui-grid-b .ui-block-b, .ui-grid-b .ui-block-c { width: 33.3%; } +.ui-grid-b > :nth-child(n) { width: 33.333%; } .ui-grid-b .ui-block-a { clear: left; } - /* grid c: 25/25/25/25 */ -.ui-grid-c .ui-block-a, .ui-grid-c .ui-block-b, .ui-grid-c .ui-block-c, .ui-grid-c .ui-block-d { width: 25%; } +.ui-grid-c .ui-block-a, .ui-grid-c .ui-block-b, .ui-grid-c .ui-block-c, .ui-grid-c .ui-block-d { width: 24.955%; } +.ui-grid-c > :nth-child(n) { width: 25%; } .ui-grid-c .ui-block-a { clear: left; } - /* grid d: 20/20/20/20/20 */ -.ui-grid-d .ui-block-a, .ui-grid-d .ui-block-b, .ui-grid-d .ui-block-c, .ui-grid-d .ui-block-d, .ui-grid-d .ui-block-e { width: 20%; } +.ui-grid-d .ui-block-a, .ui-grid-d .ui-block-b, .ui-grid-d .ui-block-c, .ui-grid-d .ui-block-d, .ui-grid-d .ui-block-e { width: 19.955%; } +.ui-grid-d > :nth-child(n) { width: 20%; } .ui-grid-d .ui-block-a { clear: left; }