Thanks for sharing. Coincidentally I’ve also used these classes in a recent project. I tried to make a responsive .alignwide class without using breakpoints but I couldn’t find a reasonable solution for this.
By the way, is there a reason for your change in classnames? .entry__content used to be .entry-content right?
[…] more examples will come out of the woodwork as more themes add styles for Gutenberg. For example, Justin Tadlock has shared his method using different calc values, and Joen Asmussen has blogged about his approach of applying max-widths to all child elements […]
7 Comments
Thanks for sharing. Coincidentally I’ve also used these classes in a recent project. I tried to make a responsive
.alignwideclass without using breakpoints but I couldn’t find a reasonable solution for this.By the way, is there a reason for your change in classnames?
.entry__contentused to be.entry-contentright?I’m using the BEM system on my current project, so my classes are a bit different from some other projects I’ve done.
Thanks for sharing
Here’s a similar approach – just in SASS for anyone who prefers that.
https://gist.github.com/felixarntz/7d94fcb0dea8a8982302e93578d7085b
Thanks for the post, Justin. A few years ago I created this Codepen using CSS3 transform that could also help.
CSS Only Full-width Image Where Parent Div is not Full-Width → https://codepen.io/ahmadawais/pen/avBwBz
Awesome! I hadn’t even though of using
transformfor that.[…] more examples will come out of the woodwork as more themes add styles for Gutenberg. For example, Justin Tadlock has shared his method using different calc values, and Joen Asmussen has blogged about his approach of applying max-widths to all child elements […]
[…] « Align wide and full classes » via Theme Hybrid [en] @themehybrid […]
Comments are closed.