MediaWiki:Common.css - Revision history

Dave: Moved Typogridphy CSS to here: MediaWiki:Typogridphy.css

2011-09-17T02:38:07Z

Moved Typogridphy CSS to here: MediaWiki:Typogridphy.css

Show changes

Dave: Revert back from px to em.

2011-09-17T01:06:40Z

Revert back from px to em.

Dave: Convert from em to px.

2011-09-16T15:38:31Z

Convert from em to px.

Dave: Add wrapper.

2011-09-16T03:39:00Z

Add wrapper.

Dave: Typogridphy CSS grid elements.

2011-09-16T03:28:02Z

Typogridphy CSS grid elements.

New page

/* CSS placed here will be applied to all skins */

/* Begin Typogridphy CSS grid elements. */

/* GRIDS */

/* Set styles common among all grids - all grid divs must be assigned this class */
.generic{
border-top:0.5em solid #666; /* The border at the top of each grid */
float:left;
padding-top:1em;
margin-bottom:2em;
}

/* Sets styles for any 'start' grids - this class MUST be given to a grid that is the first in a horizontal series */
.clear{
clear:both;
}

/* Sets styles for any 'end' grids - this class MUST be given to a grid that is the last in a horizontal series */
.end{
margin-left:0 !important;
margin-right:0 !important;
}

/* 220px */
.twotwenty{
width:22em;
margin-right:2em;
}

/* 280px */
.twoeighty{
width:28em;
margin-right:2em;
}

/* 340px */
.threeforty{
width:34em;
margin-right:2em;
}

/* 400px */
.fourhun{
width:40em;
margin-right:2em;
}

/* 460px */
.foursixty{
width:46em;
margin-right:2em;
}

/* 520px */
.fivetwenty{
width:52em;
margin-right:2em;
}

/* 580px */
.fiveeighty{
width:58em;
margin-right:2em;
}

/* 640px */
.sixforty{
width:64em;
margin-right:2em;
}

/* 700px */
.sevenhun{
width:70em;
margin-right:2em;
}

/* 760px */
.sevensixty{
width:76em;
margin-right:2em;
}

/* 820px */
.eighttwenty{
width:82em;
margin-right:2em;
}

/* 880px */
.eighteighty{
width:88em;
margin-right:2em;
}

/* 940px */
.nineforty{
width:94em;
}

/* FONT STYLES */

/* PARAGRAPHS */
.generic p{
font-size:1.2em;
line-height:1.5em;
margin-bottom:1.5em;
}

/* Styles an introductory paragraph, similar to newspapers. Assign this class to the first paragraph in an article */
p.intro:first-line{
font-variant:small-caps;
}

/* Styles a drop cap on each paragraph with this class */
p.drop:first-letter{
float:left;
font-size:3em;
margin-top:-0.05em;
margin-right:0.1em;
margin-bottom:-0.5em;
}

/* ALL THE TRIMMINGS */

blockquote p{
font-size:1.2em!important;
line-height:1.5em!important;
margin-bottom:1.5em!important;
font-style:italic;
font-weight:bold;
}

blockquote p cite{
font-style:normal;
}

.generic strong{
font-variant:small-caps;
}

.generic em{
font-style:italic;
font-weight:inherit;
}

.amp{ /* Give those ampersands a right sexy look */
font-family:Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
font-style:italic;
font-weight:normal;
line-height:inherit;
}

abbr{
border-bottom:1px dotted #666;
border-color:inherit;
cursor:help;
}

.clear{
clear:both;
}

.right-float{ /* Float any item to the right */
float:right;
margin-left:2em;
margin-right:0;
}

.left-float{ /* Float any item to the left */
float:left;
margin-right:2em;
margin-left:0;
}

.code{ /* Styling for and code type items */
font-family:Courier, "Courier New", monospace;
background:#ddd;
font-size:1em;
}

/* IMAGE STYLES */

img{
font-size:1em;
}

img.left-img{ /* Float any image to the LEFT and give it some margin */
font-size:1em;
float:left;
padding:4px;
border:1px solid #ccc;
margin-bottom:1.8em;
margin-right:2em;
margin-top:0.3em;
}

img.right-img{ /* Float any image to the RIGHT and give it some margin */
font-size:1em;
float:right;
padding:4px;
border:1px solid #ccc;
margin-bottom:1.8em;
margin-left:2em;
margin-top:0.3em;
}

/* End Typogridphy CSS grid elements. */

← Older revision		Revision as of 03:39, 16 September 2011
Line 3:		Line 3:

	/* Begin Typogridphy CSS grid elements. */		/* Begin Typogridphy CSS grid elements. */
		+
		+	/* MAIN STRUCTURE STYLES */
		+
		+	.wrapper{
		+	width:94em;
		+	margin:0 auto;
		+	}
		+
		+	.header{
		+	width:94em;
		+	padding-top:1.5em;
		+	margin-bottom:2em;
		+	}

	/* GRIDS */		/* GRIDS */

@@ Line 7: / Line 7: @@
 .wrapper{
-	width:940px;
+	width:94em;
 	margin:0 auto;
+}
 .header{
-	width:940px;
+	width:94em;
 	padding-top:1.5em;
 	margin-bottom:2em;
@@ Line 40: / Line 40: @@
 /* 220px */
 .twotwenty{
-	width:220px;
+	width:22em;
 	margin-right:2em;
+}
@@ Line 46: / Line 46: @@
 /* 280px */
 .twoeighty{
-	width:280px;
+	width:28em;
 	margin-right:2em;
+}
@@ Line 52: / Line 52: @@
 /* 340px */
 .threeforty{
-	width:340px;
+	width:34em;
 	margin-right:2em;
+}
@@ Line 58: / Line 58: @@
 /* 400px */
 .fourhun{
-	width:400px;
+	width:40em;
 	margin-right:2em;
+}
@@ Line 64: / Line 64: @@
 /* 460px */
 .foursixty{
-	width:460px;
+	width:46em;
 	margin-right:2em;
+}
@@ Line 70: / Line 70: @@
 /* 520px */
 .fivetwenty{
-	width:520px;
+	width:52em;
 	margin-right:2em;
+}
@@ Line 76: / Line 76: @@
 /* 580px */
 .fiveeighty{
-	width:580px;
+	width:58em;
 	margin-right:2em;
+}
@@ Line 82: / Line 82: @@
 /* 640px */
 .sixforty{
-	width:640px;
+	width:64em;
 	margin-right:2em;
+}
@@ Line 88: / Line 88: @@
 /* 700px */
 .sevenhun{
-	width:700px;
+	width:70em;
 	margin-right:2em;
+}
@@ Line 94: / Line 94: @@
 /* 760px */
 .sevensixty{
-	width:760px;
+	width:76em;
 	margin-right:2em;
+}
@@ Line 100: / Line 100: @@
 /* 820px */
 .eighttwenty{
-	width:820px;
+	width:82em;
 	margin-right:2em;
+}
@@ Line 106: / Line 106: @@
 /* 880px */
 .eighteighty{
-	width:880px;
+	width:88em;
 	margin-right:2em;
+}
@@ Line 112: / Line 112: @@
 /* 940px */
 .nineforty{
-	width:940px;
+	width:94em;
+}