custom Css for blockquotes

(@andyagricola)

Hello, can you please help me with coding my b-quote style in your theme? I found some styling I would like to use but I am not sure which file I am supposed to edit to make it work. The code I want to use is

[ Moderator note: code fixed. Please wrap code in the backtick character or use the code button. ]

blockquote {
	font-family: Georgia, serif;
	font-size: 18px;
	font-style: italic;
	width: 450px;
	margin: 0.25em 0;
	padding: 0.25em 40px;
	line-height: 1.45;
	position: relative;
	color: #383838;
	background:#ececec;
}

blockquote:before {
	display: block;
	content: "\201C";
	font-size: 80px;
	position: absolute;
	left: -10px;
	top: -10px;
	color: #7a7a7a;
}

blockquote cite {
	color: #999999;
	font-size: 14px;
	display: block;
	margin-top: 5px;
}

blockquote cite:before {
	content: "\2014 \2009";
}

Thank you very much for answer.

Viewing 2 replies - 1 through 2 (of 2 total)

CrouchingBruin
(@crouchingbruin)

9 years ago

but I am not sure which file I am supposed to edit to make it work.

Editing theme files directly is not recommended for any reason. Fruitful has a custom CSS option where you can copy & paste your code. Go to Apperance → Theme Options and click the Custom CSS tab at the bottom.
CrouchingBruin
(@crouchingbruin)

9 years ago
Hmm, it doesn’t look like the theme’s Custom CSS option handles escape codes very well. I would therefore use the Custom CSS Manager plugin and paste your code in there instead. The only change you’ll need to make is to “escape” the backslash characters in the content property values by adding another backslash. That is, instead of this:
```
content: "\201C";
```
Do this:
```
content: "\\201C";
```

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘custom Css for blockquotes’ is closed to new replies.

Tags