Question about formatting HTML emails for iPhone

Posted:
in iPhone edited January 2014
I have a question about how to format HTML emails to fit on an iphone. For example I can send an email to my friends who use Macs or PC's and it comes across fine in HTML. When I send it to someone who has an iPhone though the formatting isn't right.

What I mean by the above is it seems there's a problem with how it's formatted and with wrap-around.



-What is the screen width or the iPhone's mail program?



-Is there a way to format and put in the HTML a way to recognize if it's being read on a mobile device such as an iphone and then format it correctly?



The problem I'm having is I can put an image at the top of my email and it seems that if it's wider than 400 or so the text in my letter below only shows up to be about 1/3 to 1/2 the width of the iphone's screen. Yet if I make it smaller than 300 the text comes out fine and goes completely across the screen.

Yet when the email is then read on a computer with it being only 300 wide the email isn't anywhere near full screen of the email program and doesn't look correct.

Thank you for your help with the above.

Comments

  • Reply 1 of 3
    Quote:
    Originally Posted by markw10 View Post


    I have a question about how to format HTML emails to fit on an iphone. For example I can send an email to my friends who use Macs or PC's and it comes across fine in HTML. When I send it to someone who has an iPhone though the formatting isn't right.

    What I mean by the above is it seems there's a problem with how it's formatted and with wrap-around.



    -What is the screen width or the iPhone's mail program?



    -Is there a way to format and put in the HTML a way to recognize if it's being read on a mobile device such as an iphone and then format it correctly?



    The problem I'm having is I can put an image at the top of my email and it seems that if it's wider than 400 or so the text in my letter below only shows up to be about 1/3 to 1/2 the width of the iphone's screen. Yet if I make it smaller than 300 the text comes out fine and goes completely across the screen.

    Yet when the email is then read on a computer with it being only 300 wide the email isn't anywhere near full screen of the email program and doesn't look correct.

    Thank you for your help with the above.



    http://developer.apple.com/safari/li...roduction.html
  • Reply 2 of 3
    MarvinMarvin Posts: 15,322moderator
    Quote:
    Originally Posted by markw10 View Post


    -What is the screen width or the iPhone's mail program?



    320 pixels wide and 480 tall.



    Quote:
    Originally Posted by markw10 View Post


    -Is there a way to format and put in the HTML a way to recognize if it's being read on a mobile device such as an iphone and then format it correctly?



    Try the CSS code for switching websites to mobile format:



    http://www.boutell.com/newfaq/creating/iphone.html



    Emails tend to use tables for layout though so CSS overrides won't be as easy as a website.
  • Reply 3 of 3
    Thank you. That's exactly what I needed to know.
Sign In or Register to comment.