The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Help with responsive CSS for mobile

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
  • #281158


    I’m not sure if this is the space to ask these types of questions, but I’m hoping I can find someone that can help me out :)

    I’ve been designing mailchimp campaigns and have hit a snag trying to have responsive formatting for mobile and outlook. The design looks great on Desktop but the text wrapping isn’t responding the way that I would like it to.

    Here’s one of my past newsletters:

    You can see that there are 4 places in the sample newsletter where text and images are in the same box. It looks fine on desktop but as soon as you enter mobile the text distorts. Ideally, I would like the image to stack on top of the text when being viewed in a mobile device. I found this forum on here:

    and implemented pieces of this code which helped in the mailchimp mobile preview but when sent to my mobile, the stacking doesn’t work (my mobile is a Samsung Galaxy S6 – Andriod – using Gmail).

    This is my current code that I’m using in one of the blocks to try and get them to stack:

    I’m really novice at this so sorry if the above looks sloppy or weird. Evidently, I also can’t seem to make my code display in plain text >_< maybe I'm a lost cause

    @media only screen and (max-width:480px) { img { display:block; float:none; margin:0 auto 20px !important; } }


    Did you know that a production can use as much as a million sheets of paper over 6 months? Pledge Paperless for 2019 and save some trees! #GreenFilmTip: Go to Pledge Paperless to take the pledge today.

Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.