This Page

has moved to a new address:

http://www.mere-et-filles.com

Sorry for the inconvenience…

Redirection provided by Blogger to WordPress Migration Service
/* ----------------------------------------------- Blogger Template Style Name: Minima Designer: Douglas Bowman URL: www.stopdesign.com Date: 26 Feb 2004 ----------------------------------------------- */ body { background:#fff; margin:0; padding:40px 20px; font:x-small Georgia,Serif; text-align:center; color:#333; font-size/* */:/**/small; font-size: /**/small; } a:link { color:#58a; text-decoration:none; } a:visited { color:#969; text-decoration:none; } a:hover { color:#c60; text-decoration:underline; } a img { border-width:0; } /* Header ----------------------------------------------- */ @media all { #header { width:660px; margin:0 auto 10px; border:1px solid #ccc; } } @media handheld { #header { width:90%; } } #blog-title { margin:5px 5px 0; padding:20px 20px .25em; border:1px solid #eee; border-width:1px 1px 0; font-size:200%; line-height:1.2em; font-weight:normal; color:#666; text-transform:uppercase; letter-spacing:.2em; } #blog-title a { color:#666; text-decoration:none; } #blog-title a:hover { color:#c60; } #description { margin:0 5px 5px; padding:0 20px 20px; border:1px solid #eee; border-width:0 1px 1px; max-width:700px; font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; letter-spacing:.2em; color:#999; } /* Content ----------------------------------------------- */ @media all { #content { width:660px; margin:0 auto; padding:0; text-align:left; } #main { width:410px; float:left; } #sidebar { width:220px; float:right; } } @media handheld { #content { width:90%; } #main { width:100%; float:none; } #sidebar { width:100%; float:none; } } /* Headings ----------------------------------------------- */ h2 { margin:1.5em 0 .75em; font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; letter-spacing:.2em; color:#999; } /* Posts ----------------------------------------------- */ @media all { .date-header { margin:1.5em 0 .5em; } .post { margin:.5em 0 1.5em; border-bottom:1px dotted #ccc; padding-bottom:1.5em; } } @media handheld { .date-header { padding:0 1.5em 0 1.5em; } .post { padding:0 1.5em 0 1.5em; } } .post-title { margin:.25em 0 0; padding:0 0 4px; font-size:140%; font-weight:normal; line-height:1.4em; color:#c60; } .post-title a, .post-title a:visited, .post-title strong { display:block; text-decoration:none; color:#c60; font-weight:normal; } .post-title strong, .post-title a:hover { color:#333; } .post div { margin:0 0 .75em; line-height:1.6em; } p.post-footer { margin:-.25em 0 0; color:#ccc; } .post-footer em, .comment-link { font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; letter-spacing:.1em; } .post-footer em { font-style:normal; color:#999; margin-right:.6em; } .comment-link { margin-left:.6em; } .post img { padding:4px; border:1px solid #ddd; } .post blockquote { margin:1em 20px; } .post blockquote p { margin:.75em 0; } /* Comments ----------------------------------------------- */ #comments h4 { margin:1em 0; font:bold 78%/1.6em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; letter-spacing:.2em; color:#999; } #comments h4 strong { font-size:130%; } #comments-block { margin:1em 0 1.5em; line-height:1.6em; } #comments-block dt { margin:.5em 0; } #comments-block dd { margin:.25em 0 0; } #comments-block dd.comment-timestamp { margin:-.25em 0 2em; font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; letter-spacing:.1em; } #comments-block dd p { margin:0 0 .75em; } .deleted-comment { font-style:italic; color:gray; } /* Sidebar Content ----------------------------------------------- */ #sidebar ul { margin:0 0 1.5em; padding:0 0 1.5em; border-bottom:1px dotted #ccc; list-style:none; } #sidebar li { margin:0; padding:0 0 .25em 15px; text-indent:-15px; line-height:1.5em; } #sidebar p { color:#666; line-height:1.5em; } /* Profile ----------------------------------------------- */ #profile-container { margin:0 0 1.5em; border-bottom:1px dotted #ccc; padding-bottom:1.5em; } .profile-datablock { margin:.5em 0 .5em; } .profile-img { display:inline; } .profile-img img { float:left; padding:4px; border:1px solid #ddd; margin:0 8px 3px 0; } .profile-data { margin:0; font:bold 78%/1.6em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; letter-spacing:.1em; } .profile-data strong { display:none; } .profile-textblock { margin:0 0 .5em; } .profile-link { margin:0; font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif; text-transform:uppercase; letter-spacing:.1em; } /* Footer ----------------------------------------------- */ #footer { width:660px; clear:both; margin:0 auto; } #footer hr { display:none; } #footer p { margin:0; padding-top:15px; font:78%/1.6em "Trebuchet MS",Trebuchet,Verdana,Sans-serif; text-transform:uppercase; letter-spacing:.1em; } /* Feeds ----------------------------------------------- */ #blogfeeds { } #postfeeds { }

Wednesday, August 22, 2007

html lesson.

...thought this might be helpful for at least one person I know who blogs - and my mom - sorry we lost you yesterday!

First, the hearts. Sara provided instructions to make a heart shape show up on the page. I frequently use hearts in my journal - they're easy to draw and fun to look at! - but didn't know how to make one on-line. The trick is to put three things together (& + "hearts" + ;) to make an html command. So when blogger displays it, it executes the command and shows this ♥ Sara learned this while posting on my space, so I am now (finally?!) convinced that my space has some redeeming value!

Now, what I learned today about line spacing. I updated the ee cummings poem in the sidebar (the beach was seeming like distant past and this one spoke to me!) and noticed the line spacing was almost like double. Did some research. The blogspot help directed me here and then here and I experimented and came up with this (a shortened version to illustrate the point!):

here's the html:
<+span style="LINE-HEIGHT: 1.1;font-size:85%;" +><+em+>i shall imagine life is not worth dying,if (and when)roses complain their beauties are in vain but though mankind persuades itself that every weed's a rose,roses(you feel certain)will only smile<+/em><+/span>"

and here's the formatted text:
i shall imagine life is not worth dying,if (and when)roses complain their beauties are in vain but though mankind persuades itself that every weed's a rose,roses(you feel certain)will only smile

Note that when you type the html for real, you have to leave out the "+" (I couldn't get the example text to display with the html unless I added the "+") Also, the sidebar poem has different line breaks, but I didn't keep them for this illustration.

Point is the LINE-HEIGHT command. I experimented with 1.0 and it seemed too close together. 1.2 was too far apart. 1.1 was just right. The font-size command makes the text smaller (and this was originally 78%, the smallest, but I decided I liked 85% so it went better with the box below). The "em" makes it italics (don't forget the <>). And I think there's a way to embed that in the span style, but in all my experimenting, I lost that part. Fortunately, this way works!

I do feel a bit (just a bit!?) behind the times and slow compared to my filles - am certain this is all second nature to them, but at least I'm learning!

0 Comments:

Post a Comment

Thanks for the feedback!

Subscribe to Post Comments [Atom]

<< Home