x
Menu

Quotes

Use only when analyzing or presenting the author's exact words.

The following version includes the author information. The formatting is automatically styled with an additional CSS selector.

I'm delighted that Peel Region was recognized for our long-term commitment to implementing, evaluating and disseminating RNAO’s best practice guidelines. During Pride Month, I am doubly proud that these best practice guidelines are helping us ensure safe and inclusive environments for 2SLGBTQI+ residents in our long term care centres.

Nancy Polsinelli, Commissioner of Health Services, Peel Region

Code

With author formatting [default]. Uses the additional with_auth selector.

HTML

<div class="quote with_auth">
	<p>Qoted message here</p>
	<p>Author name</p>
</div>

CSS

.quote {
	margin: 35px 0 35px 20px;
	font-size: 1.125em;
	font-style: italic;
	font-family: "georgia", arial, snas-serif;
	padding: 10px 10px 10px 44px;
	position: relative;
	line-height: 1.5em;
	box-sizing:border-box;
	border-left: 2px solid;
	background: #f7f7f7;
}
.quote.with_auth p:last-of-type {
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-style: normal;
    position: relative;
    text-align: right;
    font-size: .925em;
    padding-top: 5px;
}
@media screen and (max-width:640px) {
	.quote {
		margin-left: 10px;
	}
}

Without author formatting if we want the quote format without a specific author.

HTML

<div class="quote">
	<p>Qoted message here</p>
</div>