Hello @yaneyremartinez22
Thank you for contacting us, as we checked your data we found out that you may be facing a stylesheet too long error.
The AMP allows only a limited ie 75kb of CSS per page, The AMP plugin uses CSS tree shaking to optimize and allow a limited amount of CSS on a page.
This may have resulted in missing some CSS on-page, resulting in a broken appearance.
After carefully inspecting the error it seems you have a few inline CSS added on some blocks, which resulted in generating excessive CSS.
eg:
{
"class": "wp-container-1 wp-block-group alignfull has-text-color has-background amp-wp-e4c752a",
"data-amp-original-style": "color:#ffffff;background-color:#000000;margin-top:0px;margin-bottom:0px;padding-top:20vw;padding-right:3vw;padding-bottom:20vw;padding-left:3vw"
}
{
"class": "wp-container-5 wp-elements-cc8ac534ed2af02d3dbaf543eea443ba wp-block-group alignfull has-text-color has-background has-link-color amp-wp-203cea7",
"data-amp-original-style": "color:#ffffff;background-color:#000000;margin-top:0px;margin-bottom:0px;padding-top:0px;padding-right:3vw;padding-bottom:30px;padding-left:3vw"
}
you can reduce CSS by creating classes for common properties and reusing them where needed.
eg:
.dark-background-white-letters{
color:#ffffff;
background-color:#000000;
margin-top:0px;
margin-bottom:0px;
padding-top:0px;
padding-right:3vw;
padding-bottom:30px;
padding-left:3vw
}
you can use the class dark-background-white-letters in block settings
I hope this is helpful!
@yaneyremartinez22 As we didn’t receive a response I’ll mark this as resolved. Feel free to open a new support topic if you require any further assistance.