Blockquote Style

• 

  anitalovett · Member · Nov 26, 2018 at 2:34 am

  • Copy link
  • Add topic to favorites

  I’m trying to change blockquote style with custom CSS. For some reason, the solid grey block that orginates in the theme is still showing. I’m not sure if I’m perhaps missing an element to override this or if something else is the issue. Would appreciate insight.

  You can view a blockquote here under Tip #9: https://anitalovett.com/2017/03/08/national-proofreading-day-10-tips-to-proof-it-up/

  The blockquote style in custom CSS is:

  blockquote {
  max-width: 650px;
  background-color: #f9f9f9;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-shadow: 1px 1px 1px #ccc;
  font-style: italic;
  }

  blockquote cite:before {
  content: “2014”;
  }

  It looks as it should (minus the border not showing, but I can live with that) except for the rectangular box sitting on top of the quote box. Any insight on how to get rid the rectangular box?

  The blog I need help with is: (visible only to logged in users)

• 

  khushbudesaiblog · Member · Nov 26, 2018 at 5:51 am

  • Copy link

  Hi there,

  I just changed below CSS where background has been commented.
  blockquote:before {
  content: “”;
  position: absolute;
  top: -30px;
  left: 30%;
  bottom: -30px;
  right: 10%;
  /* background: #f5f5f5; */
  z-index: -1;
  }

  After changing page looks like this:
  https://imgur.com/a/S19V8gq

  Hope this is what you want.

• 

  anitalovett · Member · Nov 26, 2018 at 1:57 pm

  • Copy link

  Thank you! :)