Difference between revisions of "MediaWiki:Common.css"
From Starfleet Commander
Jump to navigationJump to searchm |
Gary Mintz (talk | contribs) m |
||
(22 intermediate revisions by one other user not shown) | |||
Line 5: | Line 5: | ||
font-size: 10pt !important; | font-size: 10pt !important; | ||
white-space: pre-line; | white-space: pre-line; | ||
+ | } | ||
+ | |||
+ | /* test: fix headers and content overflow to the right over/under infoboxes */ | ||
+ | h2, h3, h4, h5, h6, tt, code, pre { | ||
+ | overflow: hidden; | ||
+ | direction: ltr; | ||
+ | } | ||
+ | h2 { | ||
+ | clear: left; | ||
+ | } | ||
+ | div.thumb.tright { | ||
+ | clear: none; | ||
+ | } | ||
+ | |||
+ | /* Text align */ | ||
+ | .tal { | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | .tac { | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | .tar { | ||
+ | text-align: right; | ||
+ | } | ||
+ | |||
+ | .vam a img, .vam img, .vab img, .vab a img, .vabl img, .vabl a img, .vat img, .vat a img { | ||
+ | border: 0; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | .vam, .vam a img, .vam img { | ||
+ | vertical-align: middle; | ||
+ | padding: 0 0 2px 0; | ||
+ | } | ||
+ | |||
+ | .vab, .vab img, .vab a img { | ||
+ | vertical-align: bottom; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | .vabl, .vabl img, .vabl a img { | ||
+ | vertical-align: baseline; | ||
+ | padding: 0; | ||
+ | } | ||
+ | .vat, .vat img, .vat a img { | ||
+ | vertical-align: top; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | /* table class infobox */ | ||
+ | table.infobox { | ||
+ | clear: right; | ||
+ | float: right; | ||
+ | width: 22em; | ||
+ | border-collapse: separate; | ||
+ | border: 1px solid #aaa; | ||
+ | background-color: #f9f9f9; | ||
+ | margin: 0 0 1em 1em; | ||
+ | padding: 0.2em; | ||
+ | text-align: left; | ||
+ | font-size: 88%; | ||
+ | line-height: 1.5em; | ||
+ | color: black; | ||
+ | border-spacing: 5px; | ||
+ | /*table-layout: fixed;*/ | ||
+ | } | ||
+ | |||
+ | table.infobox td, table.infobox th { | ||
+ | vertical-align: top; | ||
+ | } | ||
+ | |||
+ | table.infobox th { | ||
+ | font-weight: bold; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | table.infobox th.caption { | ||
+ | text-align: center; | ||
+ | font-size: 125%; | ||
+ | font-weight: bold; | ||
+ | font-style: italic; | ||
+ | background-color: #AAA; | ||
+ | } | ||
+ | |||
+ | table.infobox th.title { | ||
+ | text-align: center; | ||
+ | background-color: #DDD; | ||
+ | } | ||
+ | |||
+ | table.infobox th.subtitle { | ||
+ | text-align: center; | ||
+ | background-color: #EEE; | ||
+ | } | ||
+ | |||
+ | /* Quote style */ | ||
+ | .quote-style { | ||
+ | padding: 1em; | ||
+ | border: 1px dashed #2f6fab; | ||
+ | text-align: left; | ||
+ | color: #000; | ||
+ | background-color: #f9f9f9; | ||
+ | } | ||
+ | |||
+ | /* scale width picture */ | ||
+ | .scale-width-picture { | ||
+ | clear: left; | ||
+ | display: block; | ||
+ | overflow: hidden; | ||
+ | white-space: pre-line; | ||
+ | direction: ltr; | ||
+ | } | ||
+ | |||
+ | .scale-width-picture img { | ||
+ | width: 100%; | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | .scale-width-picture:after { | ||
+ | content: " "; | ||
+ | } | ||
+ | |||
+ | /** | ||
+ | * | ||
+ | * full width Picture | ||
+ | * width of article content | ||
+ | * on a 768 px wide screen | ||
+ | * | ||
+ | **/ | ||
+ | |||
+ | .full-width-picture { | ||
+ | clear: both; | ||
+ | display: block; | ||
+ | Width: 100%; | ||
+ | overflow-x: auto; | ||
+ | } | ||
+ | |||
+ | .full-width-picture img { | ||
+ | /*width: 100%;*/ | ||
+ | height: auto; | ||
+ | min-width: 500px; | ||
+ | } | ||
+ | |||
+ | /* fixed width picture */ | ||
+ | .fixed-width-picture { | ||
+ | clear: both; | ||
+ | display: block; | ||
+ | overflow-x: auto; | ||
+ | } | ||
+ | |||
+ | .fixed-width-picture img { | ||
+ | height: auto; | ||
+ | min-width: 500px; | ||
+ | } | ||
+ | |||
+ | #content { | ||
+ | min-width: 599px; | ||
} | } |
Latest revision as of 03:25, 6 October 2013
/* CSS placed here will be applied to all skins */ /* fix to chrome and safari */ pre, tt, code { font-size: 10pt !important; white-space: pre-line; } /* test: fix headers and content overflow to the right over/under infoboxes */ h2, h3, h4, h5, h6, tt, code, pre { overflow: hidden; direction: ltr; } h2 { clear: left; } div.thumb.tright { clear: none; } /* Text align */ .tal { text-align: left; } .tac { text-align: center; } .tar { text-align: right; } .vam a img, .vam img, .vab img, .vab a img, .vabl img, .vabl a img, .vat img, .vat a img { border: 0; margin: 0; } .vam, .vam a img, .vam img { vertical-align: middle; padding: 0 0 2px 0; } .vab, .vab img, .vab a img { vertical-align: bottom; padding: 0; } .vabl, .vabl img, .vabl a img { vertical-align: baseline; padding: 0; } .vat, .vat img, .vat a img { vertical-align: top; padding: 0; } /* table class infobox */ table.infobox { clear: right; float: right; width: 22em; border-collapse: separate; border: 1px solid #aaa; background-color: #f9f9f9; margin: 0 0 1em 1em; padding: 0.2em; text-align: left; font-size: 88%; line-height: 1.5em; color: black; border-spacing: 5px; /*table-layout: fixed;*/ } table.infobox td, table.infobox th { vertical-align: top; } table.infobox th { font-weight: bold; text-align: left; } table.infobox th.caption { text-align: center; font-size: 125%; font-weight: bold; font-style: italic; background-color: #AAA; } table.infobox th.title { text-align: center; background-color: #DDD; } table.infobox th.subtitle { text-align: center; background-color: #EEE; } /* Quote style */ .quote-style { padding: 1em; border: 1px dashed #2f6fab; text-align: left; color: #000; background-color: #f9f9f9; } /* scale width picture */ .scale-width-picture { clear: left; display: block; overflow: hidden; white-space: pre-line; direction: ltr; } .scale-width-picture img { width: 100%; height: auto; } .scale-width-picture:after { content: " "; } /** * * full width Picture * width of article content * on a 768 px wide screen * **/ .full-width-picture { clear: both; display: block; Width: 100%; overflow-x: auto; } .full-width-picture img { /*width: 100%;*/ height: auto; min-width: 500px; } /* fixed width picture */ .fixed-width-picture { clear: both; display: block; overflow-x: auto; } .fixed-width-picture img { height: auto; min-width: 500px; } #content { min-width: 599px; }