1. Make a whole new module (if you’re using a page builder) or section that will load differently on different devices.

– Pros: Relatively easy to do. (Most page builders allow you to just check a device on/off, so just clone a module and click away)
– Cons: Sometimes the responsiveness can become unruly when whole modules switch out. Once you start caring about line breaks on all devices (as you should, but there are way too many people who don’t), then this could become too limiting and frustrating real soon.

I found that the cons outweigh the pros in this case.

So.. something else.

Also, if you want to really fine-tune and be really nit-picky about the responsive behavior, it really shows that extra bit of designer OCD that puts you above the crowd.

What you did was define a class that will act like a regular character when screen width is under 551px, and disappear when it’s 551px and over. Also, another class to tag-team with it so there’s a switch-like behavior to the line breaks.

About The Author

Hi, I'm a front-end wordpress developer, web designer, and hobbyist photographer living in Australia, and I made this website to share thoughts and tips about web design and everything related to it. If you want to chat, drop me a line at pk@almostinevitable.com

You should subscribe

I hate hate hate spam. So I will try to provide a newsletter with useful tips and freebies once every other week, or once a month. Does that sound ok? Cool!

Email address:

Leave this field empty if you're human:

Y No Ads?

I don’t have any ads on my website because:

a. I hate ads. I always use ad-blockers, so I expect others to use them as well.b. I have a web design job that pays for groceries, gas, and rent.c. I plan on selling child themes, layouts, and courses on this site, so proper products to be added later.