Usually I make emails handcoded, but one of my clients have started to use Salesforce Marketing Cloud, Email Studio. So I make templates intended for that system. But the layout breaks when viewed in Outlook.com and Office 365 (other email clients are fine).
I have been able to make a working template when I use the module ”Free Form” in Marketing Cloud, which only is a container for my handcoded html. But my client wants to use some functions for dynamic content, which forces me to use the tools for that purpose in the system. The dynamic content isn't working with ”Free Form”. So when trying to use the modules in the system, extra tags are inserted and the layout of the email totally breaks in Outlook.com and Office 365 (se attached images, working handcoded html is Test 23 and using the built-in modules is Test 24). I can also recreate the problem using one template right out of the box from Salesforce Marketing Cloud.
I insert links to the complete code for both of the emails (since the code is too long to publish here). Test 23 which is working, and Test 24 which is not (the content shown here is dummy content, and the layout requires some touch-up, but that's another thing). I would really appreciate help to solve this.
Below is images of Test 23 and Test 24. These images are screen dumps from test via Litmus. The email are ment to display as Test 23. The html code for each of the emails are to be found on these links:
Best Answer
There will always be some sort of rendering problems on Outlook, Windows 10 Mail and some lesser known Email clients (like GMX) if you are planning on using standard SFMC Content Builder blocks as they are.
While I haven't checked your code for the Emails, the client of yours needs to understand that by using Content Blocks the Email code is prepared by the SFMC in the back - and it will not always be 100% compatible with all devices / Email clients.
If client wants fully responsive Emails that work perfectly in all browsers/devices/clients then the only way to go is pure HTML/CSS with AMPScript.
With current scenario there are two options:
You create custom blocks (Free Form or HTML) that are prepared by you that already have all the Outlook specific fixes applied.
You utilize Content Builder SDK and create fully custom content blocks for the client to use. This is very code heavy option though.
Perhaps useful to read: