• Resolved James Revillini

    (@jrevillini)


    Got a new one for you. Seems like when I use a @media query in my inline CSS, it gets cut off prematurely in the output, while it works fine in the editor.

    I have a vertical stack group with the following inline style defined:

    [block] {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      padding-top: 1vw!important;
    }
    
    @media (max-width:1919px) {
      [block] {
        padding-top: 10px;
      }
    }

    The output looks like this:

    <style id="pcss-block-pcss-7beda7c1-inline-css">
        .pcss-7beda7c1 {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            padding-top: 1vw!important
        }
    
        @media (width </style>
    <style id="wp-block-heading-inline-css">
        h1.has-background,h2.has-background,h3.has-background,h4.has-background,h5.has-background,h6.has-background {
            padding: 1.25em 2.375em
        }

    It looks good until @media (width </style>

    I have not looked at whether or not this is happening in all instances and I have not tried in a vanilla environment yet. I’ll add more info as I look into it.

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Kevin Batdorf

    (@kbat82)

    I can reproduce it. I’ll take a look. Thanks for reporting it!

    Plugin Author Kevin Batdorf

    (@kbat82)

    Today’s release has a fix for this. Let me know if it works. you probably need to make a change for it to re compile. Just put a space at the end then remove it.

    Let me know if you have any other issues or any features you think are missing.

    Thread Starter James Revillini

    (@jrevillini)

    Beautiful! Thank you so much. RESOLVED

Viewing 3 replies - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.