MediaWiki:Typogridphy.css
Jump to navigation
Jump to search
Note: After saving, 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: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* Based on Typogridphy. */
/* Begin Typogridphy CSS grid elements. */
/* MAIN STRUCTURE STYLES */
html{
font-size:100%;
min-height:101%;
}
body{
font-size:100%;
font-family:Georgia, "Times New Roman", serif;
color:#666;
background:/*url(images/grid.gif) top center repeat-y*/ #fff; /* Uncomment to display the grid */
border-top:0.5em solid #666;
padding:0 1em;
}
.wrapper{
width:94em;
margin:0 auto;
}
.header{
width:94em;
padding-top:1.5em;
margin-bottom:2em;
}
/* 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. */