My favorites | Sign in
Project Home Downloads Wiki Issues Source
Search
for
CssGuide  
Simplish CSS dimensions and basics.
Phase-Implementation, Phase-Deploy
Updated Jan 28, 2011 by utopian....@gmail.com

Introduction

style.css

#container
	#header
	#content-wrapper
		#content
			#article-n (.hentry)
				.entry-title
				.posted
				.entry-content
				.meta
		#sidebar
	#footer

Details

The outermost #container element is 900 pixels wide, and sets the overall width for division among the horizontal dimensions of #container's children.

The div with id #header is 62 pixels high, containing the site title and description text h1 and h2 elements.

The selector for div #content-wrapper sets background color.

The #content div defines the left-hand column that contains the posts or page main content. It is 662 pixels wide, leaving 900 - 662 = 238 pixels of #container's width.

Within the #content div is a set of at least one #article-n divs, each of which comprise a blog entry or the text of a Wordpress page. The child elements within an #article-n div are structured according the the hAtom standard, including a sub-element hCard for the entry's author.

The div with id #sidebar defines the right-hand column for secondary content at 200 pixels wide, leaving 38 marginal pixels of #container's width.

Div #footer sets the last div of each view at 40 pixels high, enough to contain the p and ul elements for textual Wordpress credits and Simplish's own link and hCard.

Print styles

The stylesheet concludes with a @media print section that most noticeably suppresses display of the sidebar on every view, the comment form on any individual entry, and many of the screen display's characteristic outline boxes.

See Also


Sign in to add a comment
Powered by Google Project Hosting