!Header Buttons Right Side

How to simulate a 12 column grid in page (WordPress page builders friendly)

December 27, 2019
12 columns in elementor

Recently while developing a website in WordPress using Elementor, I needed to replicate the 12 columns the designer used in Adobe XD to create the layout, so to ease development I created an overlay with 12 columns to help me check the alignment and positioning of the items, check it out!

The above code creates a 12 column table, overlays it on the page, sets it’s max-width to a container, and the best trick, sets pointer-events to none, so the table won’t capture the clicks and you can still use the website or develop with your favorite page builder with no issues.

Feel free to play with the code above and ask any questions!

The post How to simulate a 12 column grid in page (WordPress page builders friendly) appeared first on Nelito.

  • All
  • Cats
  • Dogs
  • Uncategorized
Calico cat on a gray seat

Cute Ways Your Cat ‘Helps’ Around The House

Do you have a lot going on this holiday season? Many people are going to…
Read More
Two cats on a gray couch

Introducing Two Cats

Have you been considering getting a second kitty? If so, you have a purrfect chance:…
Read More
Lady in blonde hair and white long shirt hugging a dog

Brushing Your Dog’s Teeth

Did you know that brushing your dog’s teeth is one of the best things you…
Read More
1 2 3 70