How to remove padding from the boxed text in MailChimp

How to remove padding from the boxed text in Mailchimp

So, you’ve designed a nice flowing email with full-width images that blend perfectly into background coloured text boxes. You’re now building it in MailChimp when you realise… 

So, you’ve designed a nice flowing email with full-width images that blend perfectly into background coloured text boxes. You’re now building it in MailChimp when you realise… oh, how do I remove the border from ‘boxed text’ containers? Frustratingly there currently is no option to turn off the padding. However, when we recently hit this problem, one of our awesome Dev guys accepted the challenge and found a solution. 

 

Guide on removing the padding from MailChimp boxed text 

 

Step 1
Start by styling a ‘boxed text’ container exactly how you’d like it. 

 

Step 2
Preview the email, right click and select ‘Inspect Element’.


Step 3
Click on the boxed text container which will reveal the HTML code. 


Step 4
Scroll up to find the start of the tag, right click and select ‘Edit as HTML’ 

 

Step 5
Select all and copy.  

 

Step 6
Go back to the MailChimp template editor. Drag and drop a ‘Code’ block under your boxed text. 

 

Step 7
Remove the placeholder HTML code and paste in your copied code. 

 

Step 8
Now here is where we remove the padding. Find where it says padding-top: 9px;padding-left: 18px;padding-bottom: 9px;padding-right: 18px; and delete it.

 

Step 9
The padding has gone! *Hands up in celebration* 

 

Step 10
Remove the original boxed text and finally preview and test.  

 

To read more of useful resources click here.

Browse other resources

Trusted digital agency

  • google_partner_logo-min
  • iso27001-16779-small-min
  • thedrumrecommends_logo-min
UK Search Awards - SEO Winner
Wirehive Best Use of Search 2018
Drum Search Awards SEO finalist 2018
UK Search Awards 2018 SEO Award
5-wirehive-performance-marketing-campaign-finalist-v2
6-wirehive-consumer-site-of-the-year-finalist-v3

Maidstone - Kent

7 James Whatman Court, Turkey Mill, Maidstone, Kent, ME14 5SS

Soho - London

2 Bourchier Street, Soho, London, W1D 4HZ

Cape Town - South Africa

16 Edison Way, 1st Floor, Block D, Edison Square, Century City, Cape Town, 7441 South Africa

Proud to be a Lab Logo agency

5 Star reviews

Reflect Digital is rated 4.95 out of 5, based on 22 reviews on Facebook & Google