MediaWiki:Common.css

From Story Lists
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */

/* Template:li */

/* The space between {{li start}} and {{li end}} */
.li-main {
	text-align: center;
}

/* {{li start}} with "nowrap" option */
.li-main-nowrap {
	white-space: nowrap;
}

/* Each individual li block */
.li-block {
	display: inline-block;
	margin: 14px 7px;
	border: solid darkgray 1px;
	padding: 5px;
	vertical-align: top;
	text-align: center;
	white-space: nowrap;
}

/* li-image-block = The block containing the image and its description (if any)
li-noimage-block = The block containind text that my be shown in case of no image */
.li-image-block, .li-noimage-block {
	display: inline-block;
	height: 185px;
}

/* Small version of .li-image-block (containing a smaller image) or li-noimage-block */
.li-small-image-block, .li-small-noimage-block {
	display: inline-block;
	height: 120px;
}

/* A div containing only the image (without the text description) */
.li-image-block .li-image {
	display: inline-block;
	vertical-align: middle;
	height: 160px;
}

.li-small-image-block .li-image {
	display: inline-block;
	vertical-align: middle;
	height: 100px;
}

/* The image itself in the li template */
.li-image-block img, .li-small-image-block img, .li-noimage-text {
	padding-left: 30px;
	padding-right: 30px;
}

/* The text description of each image (if any) */
.li-image-text {
	font-size: small;
	padding-left: 10px;
	padding-right: 10px;
}

/* An empty div used to vertically align the image */
.li-image-space {
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

/* The text displayed (if any) in place of an image */
.li-noimage-text {
	display: inline-block;
	vertical-align: middle;
	font-size: small;
}

/* Logo */
#p-logo {
	height: 100px;
}