Hoping someone can help me out with this. I have some HTML/CSS skills but I can't figure this out.
I am building our new email design in Dynamics, but I can't find a way to make the section 100% wide, while the content inside (the column) is only 600px. If I set the email width to 600px, I can't spread the grey and orange background colors over the full width of the email. See below for clarification:

I have tried to add some coding like:
.outer {
width: 600px !important;
max-width: 600px;
}
.inner {
width: 600px !important;
max-width: 600px;
}
.imageWrapper {
width: 600px !important;
max-width: 600px;
}
.logo-image {
width: 270px;
}
div div {
background-color: transparent;
}
[data-layout="true"] {
margin: 0 auto;
max-width:
/* @layout-max-width */
100
/* @layout-max-width */
;
}
@media screen and (max-width: 768px) {
.outer {
width: 100% !important;
max-width: 600px;
}
.inner {
width: 100% !important;
max-width: 600px;
}
.imageWrapper {
width: 100% !important;
max-width: 600px;
}
}
But that doesn't work the way it should. In mobile, it is not 100% but 600px, and in MSO it is especially awful looking.
PLEASE HELP! I'm breaking my brain over this.