Page History

...

If you'd like the mobile version of your element to appear at screens that are sized 480px and less (when all the columns stack on top of each other), instead of 645px and less, here's the fix:

Go
1. Once you're done designing your email, go to the paintbrush icon in the left sidebar, and under "Advanced Styles" click the "Edit" button.
2. Inside the additional CSS, paste in the following code, then click "Apply" 

@media (min-width: 480.2px) {
  .hide-in-desktop {
    display: none !important;
  }
  
  .hide-in-mobile {
    display: block !important;
    max-height: none !important;
    max-width: none !important;
    font-size: inherit !important;
    min-height: auto !important;
  }
}

The annoying drawback to this fix: once you've applied the code, all elements set to "Hide in Desktop" disappear from the Eloqua editor, and you will not be able to see them or edit them, even when you're in "mobile" view. It still works fine when you actually send your email (make sure to send test emails and check mobile sizes), but the way the CSS code gets applied in the editor isn't quite right.

To avoid this issue, make sure to wait to add this code until after you're completely done editing your email. You can also always delete the code and re-add it later if you need to make an adjustment.

Image Columns Overlap on Tablet Issue (Outlook)

...

The only drawback with this fix is that any image in a column that uses the image scale to adjust the size, gets changed to take up the full width of the column instead of whatever size you scaled it to. So make sure to use "autofit" for your images inside columns half-width or less, or remove this css code if you don't need it (sometimes you have to make design compromises).