Blockquote confusion

Premium Theme Support › DesignOrbital › Dicot

• Author
  Posts
• August 28, 2018 at 12:49 am #134387
  
  thejuice
  

  Member

  Original poster

  G’day again,

  I’m putting a couple of blockquotes in a post, and what I see when I add the blockquote while writing the post is completely different from the result when I publish it.

  Example here

  Is there a way I can get the published version to look like the version I get while creating?

  Thanks.

  The blog I need help with is: cross.com.au

  August 28, 2018 at 5:12 am #134395
  
  designorbital
  

  Theme Author

  Hi,

  It seems editor has different CSS to render blockquote.
  Please share a page with blockquote. I will try to share a CSS Snippet to resemble it.

  Thanks

  August 28, 2018 at 5:17 am #134396
  
  thejuice
  

  Member

  Original poster

  I’ve added a live blockquote to the test page.

  https://cross.com.au/2016/09/26/test/

  I love the look on the creation page because it’s professional looking, unlike what happens when it’s published :-(

  Thanks.

  August 29, 2018 at 10:50 am #134429
  
  designorbital
  

  Theme Author

  Hi,
  Please try the following CSS Snippet.

  
  blockquote {
    background-color: #e8f0f6;
    border-left: 4px solid #b0b7ba;
    font-size: 18px;
    padding: 10px 20px;
    text-align: left;
  }
  blockquote:before {
    display: none;
  }
  

  Thanks

  August 30, 2018 at 3:20 am #134456
  
  thejuice
  

  Member

  Original poster

  Ah, that’s awesome. I can fiddle with the font and so on from there.

  Thanks again.

  August 31, 2018 at 11:10 am #134484
  
  thejuice
  

  Member

  Original poster

  Opening this up again with another question – how do I remove the massive gaps above and below the blockquote? Really happy with how it looks apart from that.

  https://cross.com.au/2016/09/26/test/

  August 31, 2018 at 12:25 pm #134487
  
  designorbital
  

  Theme Author

  Hi,
  You have done amazing job in blockquotes.
  Please try the following CSS Snippet to control the blockquotes gaps.

  
  p + blockquote,
  blockquote + blockquote {
      margin: .5em auto;
  }
  

  Thanks

  August 31, 2018 at 1:11 pm #134489
  
  thejuice
  

  Member

  Original poster

  Thanks again, awesome. Great support.

  Thought the blockquotes looked better in the same blue as the theme, and then white was the best font colour.

• Author
  Posts

The topic ‘Blockquote confusion’ is closed to new replies.