Skip to content

Critical CSS: Invalid charset rule #33447

@ice9js

Description

@ice9js

Impacted plugin

Boost

Quick summary

It seems the css output from critical css contains an invalid @charset rule. According to the specification, it must be the first element in the stylesheet and cannot be nested.

Originally reported on the forum: https://wordpress.org/support/topic/css-parse-error-5/

The offending line:

<meta name=description content="Harika siteler sitesi Sunipeyk Yapay Zeka (AI),WordPress, web standartları, kullanıcı deneyimi, markalar, sosyal medya, tasarım üzerine yazılar ve bilimkurgu, poster çalışmaları, film ve romanlar, kitap kapakları."><style id="jetpack-boost-critical-css">@media all{body{background-color:#fff;color:#32373c;font-family:Roboto,system-ui,sans-serif;font-size:20px;line-height:1.6;margin:0 auto}figure{margin:0}.searchfield{border-radius:.5em 0 0 .5em;border-width:0;padding:.5em}.arabutton{background-color:#32373c;color:#fff;border-radius:0 .7em .7em 0;border:none;padding:.5em 1em}.title{font-size:2em}.title,p{overflow-wrap:break-word}.posttarihi{margin:1em auto;border-top:2px solid}h1{margin:0}h2{line-height:1.2}h3{font-style:italic;line-height:1.2}.ana a{border-radius:2em;color:#32373c;font-weight:500;text-decoration:none}.page-numbers{border-radius:.2em}.dots,.none{display:none}.page-numbers{color:#000;margin:.2em .1em;padding:.04em .2em;text-decoration:none}input{width:100%;padding:.7em;box-sizing:border-box}input{font-size:1em}.page-numbers{background:#ddd}.alignright{float:right}.ikili a,a{color:inherit;text-decoration:none}.ikili{display:grid;background:#f5f5f5}img{max-width:100%;height:auto;vertical-align:middle}.ikili figure{display:grid;overflow:hidden}:where(.ikili h2,.ikili p){padding:0 5%}.ikili aside{align-self:flex-end;width:90%}.maingrid{display:grid;gap:1em}.menuitem{font-size:1.2em;margin:1em 0 .5em 0;padding:0 .5em}.searchform{display:flex;width:100%}.ana{display:none;width:100%}.burger-shower{display:none}.hamburger{width:25px;margin:1.6em 0}.hamburger span,.hamburger:after,.hamburger:before{background-color:#32373c;border-radius:3px;content:"";display:block;height:4px;margin:4px 0}.navholder{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:.5em 5%;margin:0 auto}nav{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.tepe{background-color:#e9e930}.baslik{display:flex;align-items:center;text-decoration:none}.siteismi{color:#32373c;font-size:1.6em;font-style:italic;font-weight:900;padding:.05em .3em 0 .2em}.splogo{width:2.24em;height:2.24em;background:#eee;border:4px solid #32373c;border-radius:50%;position:relative}.splogo:after{content:"";width:20px;height:4px;background-color:#32373c;border-radius:0 3px 3px 0;top:28px;left:0;position:absolute}.splogo:before{content:"";width:20px;height:4px;background-color:#32373c;border-radius:3px 0 0 3px;top:12px;right:0;position:absolute}@media (min-width:768px){.navholder{flex-wrap:nowrap}.hamburger{display:none}.ana{display:flex;width:60%}.searchform{flex:2}.menuitem{flex:1;text-align:center;padding:0;margin:1.2em .5em}.ikili figure{border-radius:.5em .5em 0 0}.ikili{border-radius:.5em}.ikili:first-child{grid-column:1/span 8}.ikili:nth-child(2){grid-column:9/span 4}.ikili:nth-child(3){grid-column:1/span 4}.ikili:nth-child(4){grid-column:5/span 4}.ikili:nth-child(5){grid-column:9/span 4}.maingrid{grid-template-columns:repeat(12,1fr);padding:1em 5%}}@media (prefers-color-scheme:dark){body{background:#222;color:#fff}.home{background-color:#222}.siteismi{color:#eee}.searchfield{background-color:#eee}a{color:#06c}.ana a,.ikili a{color:#fff}.ikili{background-color:#000}.tepe{background-color:#222}.hamburger span,.hamburger:after,.hamburger:before{background-color:#fff}.posttarihi{color:#ddd}.arabutton{background-color:#666}}}@media all{@charset "UTF-8";.screen-reader-text{clip:rect(1px,1px,1px,1px);word-wrap:normal!important;border:0;-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}:where(figure){margin:0 0 1em}}</style><title>SUNIPEYK &#8211; Harika siteler sitesi</title>

Steps to reproduce

A clear and concise description of what you expected to happen.

Critical CSS output should be valid by W3 standards.

What actually happened

No response

Impact

One

Available workarounds?

No and the platform is unusable

Platform (Simple and/or Atomic)

No response

Logs or notes

No response

Metadata

Metadata

Assignees

Labels

BugWhen a feature is broken and / or not performing as intendedTriaged[Plugin] BoostA feature to speed up the site and improve performance.[Pri] Normal

Type

No type

Projects

Status

Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions