Template:Vertical header/styles.css

.vertical-header { line-height: 99%; vertical-align: bottom; padding: .4em .4em .2em; background-position: 50% .4em !important; min-width: 0.875em; width: 0.875em; max-width: 0.875em; overflow: hidden; }

.vertical-header-align-top { vertical-align: top; }

.vertical-header-align-middle { vertical-align: middle; }

/* We need a selector with a "th." in front of it to make it more specific than the "th.headerSort" selector used in jquery.tablesorter.styles. .vertical-header-sortable, th.vertical-header-sortable { padding: 21px .4em .2em; }

.vertical-header-2rows { /* 0.875em * 2 */ min-width: 1.75em; width: 1.75em; max-width: 1.75em; }

.vertical-header-3rows { /* 0.875em * 3 */ min-width: 2.625em; width: 2.625em; max-width: 2.625em; }

.vertical-header-4rows { /* 0.875em * 4 */ min-width: 3.5em; width: 3.5em; max-width: 3.5em; }

.vertical-header div { /* From */ /*	-webkit-writing-mode: vertical-rl; -o-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: tb-rl; */	writing-mode: vertical-rl; /*	layout-flow: vertical-ideographic; */	/* From */ display: inline-block; /*	-webkit-transform: rotate(180deg); */	transform: rotate(180deg); padding-left: 1px; text-align: left; }

.vertical-header-align-top div { text-align: right; }

.vertical-header-align-middle div { text-align: center; }

.vertical-header-nobold { font-weight: normal; }

/* move references to better position */ .vertical-header .reference { display: inline-block; vertical-align: middle; }

/* make images display the right way around */ .vertical-header img { vertical-align: middle; transform: rotate(90deg); transform-origin: center; /* small images look better with this set when rotated. */	/* image-rendering: pixelated; currently forbidden */ /* this makes up for the fact that the size for layout purposes is now wrong. */	margin: 0 -0.5em; }