"Blockquote in center" (#1437773) / PenciDesign

Comments

manonvanos started the conversation
January 19, 2018 at 3:53am
Hi,
On my about page (https://www.flipflopwanderers.com/about) I am using a block quote. As you can see, I put the text in the center, but now the " icon is still on the left. How can I move everything from the block quote the center, so including the " icon?
Thanks
Kind regards,
Manon van Os

2,702

PenciDesign replied

January 19, 2018 at 7:38am

Hi,

This issue caused by your blockquote is too short.

Please try add more this code to Customize > Custom CSS to make it center for this page only:

body.page-id-4148 .wpb_text_column blockquote:before { content: none; }
body.page-id-4148 .wpb_text_column blockquote p span{ display: inline-block; }
body.page-id-4148 .wpb_text_column blockquote p span:before {
    color: #00a9d8;
    content: '“';
    font-family: 'Playfair Display SC',serif;
    font-size: 64px;
    font-weight: 900;
    line-height: 1;
    font-style: normal;
    position: absolute;
    top: -4px;
    left: 0;
}

Best Regards,

PenciDesign

manonvanos replied
January 21, 2018 at 2:19am
Hi,
I tried using that code, but the " icon of the quote is still not centered!

2,702

PenciDesign replied

January 21, 2018 at 3:57am

Hi,

Very sorry, I'm missing a line, please replace the codes I sent to this code:

body.page-id-4148 .wpb_text_column blockquote{ padding-left: 0; }
body.page-id-4148 .wpb_text_column blockquote:before { content: none; }
body.page-id-4148 .wpb_text_column blockquote p span{ position: relative; padding-left: 33px; display: inline-block; }
body.page-id-4148 .wpb_text_column blockquote p span:before { color: #00a9d8; content: '“'; font-family: 'Playfair Display SC',serif; font-size: 64px; font-weight: 900; line-height: 1; font-style: normal; position: absolute; top: -4px; left: 0; }

Best Regards,

PenciDesign

manonvanos replied
January 21, 2018 at 6:34am
Thank you so much, that code worked!