Yahoo! Mail adds overflow:auto to elements with max-width and max-height

Last week, the email geek-verse blew up when certain emails especially hybrid coded emails started breaking in Yahoo! Mail. Although Yahoo! Mail and Gmail has always converted height to min-height, Yahoo! Mail went the extra mile and began converting width to min-width as well.

This is a problem because hybrid emails frequently limit width with max-width (ie. width:600px;max-width:100%). However unlike width, min-width prevents max-width from overriding its value. Thank goodness after the outcry, this was reverted shortly.

However there was another change that didn’t get reverted and it has the effect of adding scrollbars to certain large divs. Basically Yahoo! Mail now appends overflow-x:auto to inline max-width styles and overflow-y:auto to inline max-height elements

Mosaico has a good writeup on this issue as well as some possible workarounds.


Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">