Jump to content

Floaters


markwill2112

Recommended Posts

I added the following to a style sheet I am working on:

 

img.floatLeft {

float: left;

margin: 4px;

}

img.floatRight {

float: right;

margin: 4px;

}

 

I then added e.g. <img src="image.jpg" class="floatLeft"> <p>Text...</p> to the body of the css to wrap text around an image. It worked fine and looked great in the browser. However, when I embedded the code in Outlook to send as an email as I do regularly with my CSS e-newsletters the 'floating' images formatting went awry.

 

Is this an overflow:auto issue, i.e if I add this to my stylesheet will it lock the 'floated' images in place or is it something else causing them to move and formatting get messed up when sending in the body of the email?

Link to comment
Share on other sites

Remember that Outlook 2007 is worse for html emails than Outlook 2002. The 2002 version will process background images but 2007 does not.

 

There are some tricks to learn for background images. Here are some examples. It's set up as an email reply to a form submission, for instance if someone submits their email address to request a brochure or product details but the general principles for html emails are stated:-

http://www.wickham43.net/formhtmlemail.php

Link to comment
Share on other sites

  • 3 weeks later...
Guest zackie40

Is this an overflow:auto issue, i.e if I add this to my stylesheet will it lock the 'floated' images in place or is it something else causing them to move and formatting get messed up when sending in the body of the email?

 

Edited by Andrea
Link Deleted - No Spam Please
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...