| @@ -1,53 +1,65 @@ | ||
| 1 | -.document-icon{ text-align: center; } | |
| 1 | +div.document-icon{ text-align: center; } | |
| 2 | 2 | |
| 3 | -.document-icon img{ | |
| 3 | +div.document-icon img{ | |
| 4 | + max-width: 89px; | |
| 5 | + max-height: 89px; | |
| 4 | 6 | border: none; |
| 5 | 7 | } |
| 6 | 8 | |
| 7 | -.document-icon a{ | |
| 9 | +div.document-icon a{ | |
| 8 | 10 | font-size: 10px; |
| 9 | 11 | line-height: 12px; |
| 10 | 12 | } |
| 11 | 13 | |
| 14 | +div.document-icon{ margin: 5px 0 0; } | |
| 15 | + | |
| 12 | 16 | /* WITHOUT DESCRIPTION */ |
| 13 | 17 | div.document-icon{ |
| 14 | - float: left; | |
| 15 | - min-height: 125px; | |
| 16 | - max-height: 145px; | |
| 18 | + display: inline-block; | |
| 19 | + vertical-align: top; | |
| 17 | 20 | overflow: hidden; |
| 18 | - padding: 10px 0; | |
| 19 | - width: 25%; | |
| 21 | + /* percents round up in some browsers, making | |
| 22 | + only 3 icons fit per line so can't use 25% */ | |
| 23 | + width: 24.5%; | |
| 20 | 24 | } |
| 21 | -div#document-icon-wrapper hr{ | |
| 22 | - border: none; | |
| 25 | +div.document-icon-wrapper{ | |
| 23 | 26 | width: 100%; |
| 24 | - height: 0; | |
| 25 | 27 | padding: 0; |
| 26 | - margin: 0; | |
| 28 | + text-align: center; | |
| 27 | 29 | } |
| 28 | 30 | /* END WITHOUT DESCRIPTION */ |
| 29 | 31 | |
| 30 | 32 | /* WITH DESCRIPTION */ |
| 31 | -td.document-icon{ width: 115px; } | |
| 32 | -table#document-icon-wrapper{ border-collapse: collapse; } | |
| 33 | - | |
| 34 | -table#document-icon-wrapper, | |
| 35 | -table#document-icon-wrapper tbody, | |
| 36 | -table#document-icon-wrapper tr, | |
| 37 | -table#document-icon-wrapper p{ | |
| 38 | - width: 100%; | |
| 33 | +div.descriptions.document-icon-wrapper div.document-icon{ | |
| 34 | + max-width: 115px; | |
| 39 | 35 | padding: 0; |
| 40 | - margin: 0; | |
| 41 | - border: none; | |
| 36 | + padding-right: 3px; | |
| 37 | + float: left; | |
| 42 | 38 | } |
| 43 | 39 | |
| 44 | -table#document-icon-wrapper td{ | |
| 45 | - padding: 5px 4px 3px; | |
| 40 | +div.descriptions.document-icon-wrapper{ | |
| 46 | 41 | vertical-align: middle; |
| 42 | + text-align: inherit; | |
| 47 | 43 | } |
| 48 | 44 | |
| 49 | -table .document-icon img{ | |
| 50 | - width: 65px; | |
| 51 | - height: 65px; | |
| 45 | +div.descriptions.document-icon-wrapper img{ | |
| 46 | + max-width: 65px; | |
| 47 | + max-height: 65px; | |
| 48 | +} | |
| 49 | + | |
| 50 | +/* clearfix */ | |
| 51 | +/* can't depend on theme having a clearfix class, | |
| 52 | +so build it into dg css */ | |
| 53 | +div.descriptions.document-icon-wrapper:before, | |
| 54 | +div.descriptions.document-icon-wrapper:after{ | |
| 55 | + content: ""; | |
| 56 | + display: table; | |
| 57 | +} | |
| 58 | + | |
| 59 | +div.descriptions.document-icon-wrapper:after{ | |
| 60 | + clear: both; | |
| 61 | +} | |
| 62 | +div.descriptions.document-icon-wrapper{ | |
| 63 | + zoom: 1; /* For IE 6/7 (trigger hasLayout) */ | |
| 52 | 64 | } |
| 53 | 65 | /* END WITH DESCRIPTION */ |