Revisiting html styles today

A Different Style Sheet

I've been making subtle changes to the sytle sheet and I realized that I should start fresh. That will let me keep the historical files as they were and I can experiment more with layout.

The W3schools site has a good tutorial on CSS.

Adding Margins

Here is a sample of my original Style Sheet.

/* Updated January 14, 2018 */

body{	
	background-color: #ccc;
	background-image: url(none);
	margin-left: 5%;
	margin-right: 5%;
	font-family: verdana, arial, helvetica, geneva, sans-serif;
	font-size: 10pt;
	}

p {}

pre{
	font-family: monaco, courier; 
	font-size: 8pt;
	}

Here is the new Style Sheet. The main change is the addition of the margins to the paragraph and preformatted tags.

/* Updated January 23, 2018 */

body{
	background-color: #ccc;
	background-image: url(none);
	margin-left: 5%;
	margin-right: 5%;
	font-family: verdana, arial, helvetica, geneva, sans-serif;
	font-size: 10pt;
	}

p {	
	margin-left: 5%;
	margin-right: 5%;
	}

pre{
	font-family: monaco, courier; 
	font-size: 8pt;
	margin-left: 10%;
	margin-right: 10%;
	}
	

The Changes

The first thing you should see is that the paragraphs are set in an additional 5% from the left and right sides. I wanted to make the headings more distinctive and felt that having them hang a bit out from the text would do the trick. I have them at 5% now but can change them as I tune the page.

I use mono-spaced type as preformatted text to show code and those are usually in the context of an explanation so I indented the preformatted text an additional 5%.

The appearance can still be modified by adding style information to the individual page or element. I'll update style sheets when I want the changes to cascade down to the pages. That's why they're called Cascading Style Sheets (CSS).

Samples

Here's text in a paragraph container

Here's preformatted text

Photo of the Day

Screen shot of Speed vs Elevation

Yesterday's Pebble Beach 10 mile loop elevation vs. speed. You can see how I slow down as I climb. Downhill is always more fun. There's another view with my heart rate. I see the chart has a -7 elevation. Not sure what that's from. I was close to sea level but not below.