Lifestyle Pro Blockquote

[pblosser]

I'd like to change the blockquote style of the Lifestyle Pro theme. Currently it is indented with " . I would like to have it indented (same amount as current) but with a left border instead of the left quotation symbol ("). Current code is as follows:

blockquote,
blockquote::before {
color: #999;
}

blockquote {
margin: 40px 40px 24px;
}

blockquote::before {
content: "“";
display: block;
font-size: 30px;
height: 0;
left: -20px;
position: relative;
top: -10px;
}

Thanks!!

[Tom]

Add these elements to blockquote and adjust to suit:

blockquote {
  border-left: lime solid 8px;
  padding-left: 10px;
}

In blockquote:before, remove :

content: "“";

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[pblosser]

This reply has been marked as private.

[Gandt]

pblosser

The reason theres a double quote appearing before each blockquote is because of this line of css:

content: ““”;

content is a css rule that generates content per se, and inside these two tags " and ", you specify which content you want to be generated. As it stands, the value has been set to “, the quotes you precisely want to remove.

So, simply remove that line of css (content: ““”;) from your code to get rid of the quotes.
To add the borders, do as Tom said and throw in a border rule with the values of your choosing:

border-left:10px solid black;

Where 10px = the width/thickness of the border
solid = the style of the border, it can be solid, dotted or dashed
black = the colour of the border

Regards
G

[Author]

Posts