CSS style sheet for Technoculture

Send by emailSend by email

Standard CSS style sheet for Technoculture

For General Formatting by Class:

.author
.abstract
.bio-heading
.cited
.copyright
.essay-heading
.notes
.section
.poetry-wide
.white (for white backgrounds)

Horizontal rule, 50% of the page, centered

hr.partial

Spacing: 40 px; 25px; 20px; 15px;

.hugebreak
.bigbreak
.smallbreak
.tinybreak

For paragraphs

p.indent 
p.noindent
p.both-ident (both left and right margin pulled in .5 in)
p.abspar
p.hanging
p.hashtag
p.blockquote
p.courier
p.times
p.verticalpadding

For images, with wrapped text; includes a border as below

.floatLeft
.floatRight

Without a border:

.floatleft
.floatright
(Note the change in capitalization)

Border for images and other elements

.border

For center (useful with divs)

.center

For center with tables:

.centerTable

For indention outside of a paragraph tag as well as compound indention:

.indent

For CSS3 columns and content grouping:

.twoColumn
.Column

For text alignment:

.text-left
.text-center
.text-right

For spans:

span.courier
span.courier-bold
span.times

For divs:

div.left-margin-15 (moves the left margin of everything in the div over 15% from the left margin on the current window)

Sidebars with an illustration or other object plus a caption with border:

.sidebarRight
.sidebarLeft

To make a sidebar, create a div (or span) with a class of either of the sidebars, then place any code you want between the two tags. The background will change to white; text and lineheight reduced to 90%; items in the div bordered just like our floatRight or floatLeft (black, 2px); and the whole box floated to the right or left.

Primary use: illustrations with captions. Between the divs, add the img tag then one nested paragraph, with a short text between the p tags. Multiple lines may be used (for instance, to add a photo credit): use the the br tag within the p tags to break text up into shorter lines. Add the divider class to the upper element of the sidebar to add a black line between the two elements.

NOTE: This should not replace the alt tag but be used with it!