I was just playing around, and decided I wanted a dotted line underneath my post title. I'm always changing things up. I like to, and besides, where would I get ideas to give you?
So here's what you do: Customization>Advanced>CSS
In the CSS box, here's what I put for the dotted line you see under my post title. You can change the pixel size and the color. (Don't you just love that handy-dandy little CSS box???)
post-title
{border-bottom:3px dotted #666666;
}
Save.
That's it!
Well, not quite. I tried to do the same thing on my Cozy Little House blog. I wanted to add a dashed red border underneath the post title. It wouldn't work in CSS.
So, I went into html and found this:
h3.post-title, .comments h4 {
font: $(post.title.font);
margin: .75em 0 0;
text-align: center;
font: $(post.title.font);
margin: .75em 0 0;
text-align: center;
And I added the line below to the bottom of what is highlighted in yellow. And it worked! Remember to close the bracket, which is below it.
border-bottom:2px dashed #CE0000;
}
}
Again you have inspired me. I wanted 7 across at the top of a blog and so changed the number in the html from 5 to 7 for the number of posts to show and at the bottom in the summary changed the 5 to a 7. It worked (did this in my brothers blog IslandRustic). Made me happy. It only worked when I changed the bottom number in the summary.
ReplyDeleteJoy
blogsaver!! this is awesome. i just applied to my blog :)
ReplyDeleteis there a way you can add a dotted line but not red?
ReplyDeleteHow do I make it shorter? I don't want it to be the full width of the post just under the title.
ReplyDelete