Streaming live at 10am (PST)

Ornamental blockquote

So, here is the thing…

I want to achieve this kind of blockquote design. With the help of custom code, I’m almost there, but seems I can never nail it down. Key things that I want to achieve:

– The floral ornaments need to be fixed width
– They need to always be vertically centered
– They should not crop nor diminish in size when viewed on smaller resolutions.

My code is as follows:

    .case-content__blockquote:before, .case-content__blockquote:after {
        content: "";
        background-size: cover;
        background-repeat: no-repeat; 
        background-position: center; 
        width: 48px;
        height: 48px;
      }
      
      .case-content__blockquote:before {
        background-image: url("quote-open.svg");
      }
      
      .case-content__blockquote:after {
        background-image: url("quote-close.svg"); 
      }

Am I missing something?