Blogger Forum | BLog Design | Template Design/coding (Moderators: Steve, Apophis) | How do I create a separate hr style?
Site Author : Topic: How do I create a separate hr style?  (Read 1397 times)
May 10, 2010, 06:53:59 AM
William Leamy
Registered Users
Quite a regular
*
User No : 13476
Posts: 123
  • Email
Email
I have a rule (an hr tag) in my blog sidebar. I want to style it differently to the hr style applied to posts.

Is this possible?

The link to my blog: http://tepidair.blogspot.com/.
« Last Edit: May 10, 2010, 06:56:57 AM by William Leamy » Logged
May 10, 2010, 09:03:35 AM
William Leamy
Registered Users
Quite a regular
*
User No : 13476
Posts: 123
  • Email
Email
Thur, thank you. This does the job nicely.
Logged
May 14, 2010, 08:53:04 PM
Taylor24Smith
Just popping in
User No : 30892
Posts: 5
Location : Canada
  • WWW
User is on moderator watch listWatched
Very nice job you have done, thanks for sharing very useful information.
Logged
May 16, 2010, 08:04:57 PM
BijuJose
Just popping in
User No : 30565
Posts: 21
Quote from: Thur on May 10, 2010, 08:17:21 AM
Hi William,

Yep, that is possible.

Example:

When you want to alter the sidebar <hr /> use a different css styling just for the sidebar section (or any other), like this:

----------------------------------------------
#sidebar hr {
color: #f00;
background-color: #f00;
height: 5px;
}
----------------------------------------------

Every <hr /> inside the post section shows its default style.

Of course you can set the post <hr /> likewise:

----------------------------------------------
#post hr {...}
----------------------------------------------

Etcetera ...

See Styling <hr> with CSS.

Good luck.

hi thanks for useful information
Logged
www.tatterednotes.com www.CRAIGJOSEPH.net
May 20, 2010, 11:43:38 PM
daisy192
Just popping in
User No : 29971
Posts: 7
ya its possible using css.
Logged
May 26, 2010, 05:04:07 AM
sshayndell12
New Here
User No : 30979
Posts: 3
When setting document style, place the STYLE element with the <STYLE> beginning tag and </STYLE> ending tag between the HEAD and the BODY elements. Therefore placement would be as follows:

<html>
<head>
<title>Example Style Settings</title>
</head>
<style type="text/css">
<!--
body {background: #FFFFFF; color: #000000; margin-top: 6%;
margin-left: 3%; margin-right: 3%}
h1 {font: 14pt ariel; color: #0000FF}
h2, h3, h4 {margin-left: -3%}
p {font: 12pt roman; text-indent: 0.5in}
a {color: #00FF00; text-decoration: none}
-->
</style>
____________________________________________________

1) Original question already answered. Please read the topic first!

2) You people never learn!?! NO COMMERCIAL LINKS!
« Last Edit: May 26, 2010, 08:31:37 AM by Thur » Logged