We build Studio templates to look as good as possible across all email clients and get your message across to all of your recipients. Despite this there are a couple of slight rendering differences that you may notice when testing your emails in your inbox compared with your preview in the Studio builder. It is worth considering the email client that you are testing with: Outlook 2002, 2003, 2007, 2010, 2013, Lotus Notes and other older browsers are out of date with their rendering of HTML this means that some of the attributes built into Studio emails won’t display in the same way as you are seeing in the preview and builder. We use some progressive enhancements in the templates to ensure more modern email clients such as Apple Mail and IOS Mail display modern HTML emails in line with current email trends whilst older browsers should still display the same content just without as much support for some of the more modern design techniques in each template. Here are some of the differences that you may notice:

1. Where are the rounded corners? Unfortunately Outlook doesn’t support the CSS property “border-radius”. This is what we use to round the corners of buttons, icons and a few images in Studio. Where border-radius isn’t supported the element will just have square corners instead. This doesn’t detract from the message of the email but will just mean that your emails look as nice as possible in the non-Outlook email browsers.
   
   iPhone 6 full-width button
   Outlook 2007 button

1. A GIF isn’t animating. Studio supports the upload of animated gifs into any image block. GIFs are commonplace in modern marketing emails, however Outlook does not support animated GIFs. As an alternative it displays the first frame of the GIF in your campaign. It is worth making sure that the first frame of the GIF is relevant without animation as a static image. 
   
   GIF on Apple Mail 9
   GIF on Outlook
   
   
2. Content or image is being clipped. Outlook tends to clip or re-size images that are above roughly 1700px tall. If you cannot decrease the size of your image to under 1700px tall, you could always crop the image into separate images. You can then upload the images separately with our no-padding header blocks and then drag the images into the correct position to display them on top of one another. If you have too much content in general then Gmail may also clip off some of your message and leave a separate link to view entire message.
3. The font is different. Support for fonts can vary from browser to browser. The fonts currently available in Studio are fairly well supported across all email clients. When you do notice a difference in the font it should always be a back-up default font that looks similar to the style that you chose and acts as a graceful degradation if the initially selected font is not supported.

This list from Campaign Monitor shows the various support for CSS properties between email clients. and should help further explain why their may be rendering differences between email clients.

We would recommend testing across a variety of email clients to get the full scope of how the email will look. It is particularly worth testing on Apple Mail, IOS Mail and Gmail as these tend to be the most popular email clients. If you are concerned that some of your users won't be seeing your email to it's full potential we would recommend including a view in browser link. Either by selecting the pre-header block or by including the {{ subscriber.view_on_web_url }} as a hyperlink somewhere within your email.

We will continue to document the progressive enhancements that we add to Studio so that you are aware of these slight variations in rendering. If during testing you find a cross-browser variation that is likely to detract from the user reading experience of the email then we would love to know so that we can look into fixing the issue for you. If this is the case please contact us at support@guestfolio.com.