0

i have this little but annoying issue displaying text content in the body of the mail. From a form page i send a mail HTML5 formatted. This is what i sent via mail() php function:

 <html>
  <head>
   <style type='text/css'>
     body{
       font-family:'Lucida Grande', Arial;
       color:#333;
       font-size:15px;
     }
    .div1{ display:inline; }
    .row {margin-bottom:5px}
    .background {background-color:#ffe508; padding:5px; font-size:18px}
</style>
 </head>
  <body>
   <div>
 <div class="row">
  <div class="div1"><strong>Company:</strong></div><div class="div1">&nbsp;  
   $company</div></div>
   </div>
    </body>
     </html>

This is what i display on OUTLOOK 2013:

Company:

company_name

It's wrong because i need to display this field on one line as i display fine on WLM

Company: company_name

i also tried to use table instead of html5 but nothing changes. Any idea? Thanks

Community
  • 1
  • 1
Ogum
  • 379
  • 1
  • 8
  • 24
  • unfortunately Outlook (and some other email clients, to be fair) is notoriously non-standards-compliant with it comes to HTML display. Trial and error is going to be your best approach, I suspect. Maybe try spans instead of divs, and/or inline styles. – ADyson Dec 12 '17 at 10:40
  • I tried with simples float:left and display: inline-block; but seems there's no way to align horizontally 2 divs. This works only with live mail. – Ogum Dec 12 '17 at 14:40
  • Did you float _both_ of them? What about spans, as I suggested? They are inline by default anyway. – ADyson Dec 12 '17 at 14:43
  • Thanks ADyson for helping. I tried with spans but no changes. Outlook is really crap – Ogum Dec 12 '17 at 15:30
  • 1
    Any reason you can't just get rid of the divs? What are they for? The line could just be `Company: $company`? – ADyson Dec 12 '17 at 15:57
  • LOL! No, i don't have problems to get rid of the divs. Sometimes i waste my time to find solutions where i should simplify everything...Thanks, in this way works – Ogum Dec 12 '17 at 16:50
  • No worries, I added it as the answer for you to accept - thanks :-) – ADyson Dec 12 '17 at 16:56

2 Answers2

1

If you don't need the divs, then simply remove them. They don't appear to be doing anything. The line could just be:

<strong>Company:</strong>&nbsp;$company

This means there's nothing which could interfere with this part of the layout.

ADyson
  • 57,178
  • 14
  • 51
  • 63
1

CSS elements such as float, width and position of <div> doe not work in Outlook.

@ADyson is correct. You don't even need them in your example.

In addition, keep in mind that margin does not work. Margin (capital M) does work. I understand that is not the correct use of Margin, but that's the way Outlook uses it. It's important to remember that email development is not Web development.

Good luck.

gwally
  • 3,349
  • 2
  • 14
  • 28