Browser: Firefox 149.0.2
OS: macOS
URL: -
Video: -
I’m running into an issue where base styles are duplicated and override smaller breakpoint styles. I had just been working on a section and believe everything was working when suddenly it wasn’t.
As an example, I have block styled as a grid. Base breakpoint has “1fr 2fr” template columns. As you can see in the first screenshot, the style is applied twice. In the second screenshot, you can see that the next breakpoint should have “2fr 3fr” columns but the base styles are reapplied and override the breakpoint styles. I’ve played around with the styles and even tried recreating the structure (screenshot 3) and it results in the same problems.
The grid is applied to the query loop element so I was thinking maybe that was the problem but the issue is present even if I separate them into separate elements. It’s also present on certain nested elements but not all. For example, I’m seeing the same styling issues on the “Featured Image” element, visible in the structure screenshot. I’m not experiencing issues anywhere else in the template.
My breakpoints have been adjusted to match Tailwind’s and the issue is occurring on/within a query loop using a custom query.
