Quotation mark after blockquote


#1

Hey there,

it´s me again with another question. Is it possible to add the same kind of quotation mark after a blockquote as is shown before the quote?
fruehling-pt.de/ueber-mich

Best

Stephan


#2

Hello Stephan,

You could achieve it by adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    blockquote:after {
        content: "\f10e";
        font-family: "Fontawesome";
        position: absolute;
        right: 0;
        bottom: 10px;
        font-style: normal;
        color: #dfdfdf;
        font-size: 50px;
    }

Regards,
Kharis


#3

Hey Kharis,

thanks for the help and sorry for my late reply.
The code you suggested works. However, is there a way to make the new quotation mark appear next to the quote, just like the one before the quote? In other words, the text is indented on the left so the quotation mark is separated, is there a way to achieve the same on the right?
Also, on mobile view the new quotation mark now covers part of the text in the blockquote.

Thanks!

Stephan


#4

Is there any solution to this?

Best

Steph


#5

Hello there,

If I got it correctly, you’d try replacing the previous code with this one:

blockquote {
  padding-right: 70px;
}   
blockquote:after {
  content: "\f10e";
  font-family: "Fontawesome";
  position: absolute;
  right: 0;
  top: 20px;
  font-style: normal;
  color: #dfdfdf;
  font-size: 50px;
}

Regards,
Kharis


#6

Yes that was exactly what I meant, thanks a lot!


#7

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis