CMS Development

koaxaca
Member

Email for Mobile

Hi, I'm building my first email in hubspot and I'm a beginner in CSS. I have used the Design Manager to build the email and have been successful in getting it to look exactly how I want it to on desktop and tablet. However, I'm running into issues with some of the elements (mostly sizing and spacing) once it's turned to mobile. I have the following code in the Additional <head> markup, but none of the changes I'm specifying for mobile are being applied. Any ideas on what I'm doing wrong?

<style type="text/css">
@media only screen and (max-device-width: 480px) {
/* mobile-specific CSS styles go here */
.sub-head{
font-size: 30px !important;
}
.button{
margin: 0px !important;
}
.footer-contact{
font-size: 25px !important;
font-weight: 600 !improtant;
}
table[class=contenttable] {
width: 320px !important;
}
}

/* regular CSS styles go here */
table.contenttable {
width: 640px;
}
</style>

0 Upvotes
1 Reply 1
jennysowyrda
Community Manager
Community Manager

Email for Mobile

Hi @koaxaca,

 

Do you have a public link to view the preview of the email? Additionally, what specifically is not rendering properly in mobile? 

 

The more information, screenshots and details you can provide, the better the Community can assist!

 

Thanks,
Jenny

0 Upvotes