Tag: css

CSS to Force Element Full-Width When Inside a Max-Width Container

container element with full width element inside

If an element like a image is wrapped by a container that has a limited width, how do you make the inner element expand outside the bounds of its container to stretch full-width of the browser window?

I used to think it could only be done with Javascript.  The reason is because there was a WordPress page builder that I used years ago that had a stretch full-width feature which used Javascript to accomplish it.

Well, thanks to the power of modern CSS, we can use calc() and vw solve this problem wonderfully!  Here’s how to do it. Continue reading CSS to Force Element Full-Width When Inside a Max-Width Container

Automatic Social Menu SCSS Styling with FontAwesome Icons

WordPress Website Planning

Do you hate dealing with styling social media icons in a WordPress theme?  Wish there was a seamless way to manage social links using the WordPress menu without having to use CSS classes?

This is a very interesting way to set the FontAwesome icons for social menu items automatically by selecting the elements using a wildcard href attribute search.

Continue reading Automatic Social Menu SCSS Styling with FontAwesome Icons