asked on

Generate a good looking HTML Table for a Lotus Note Client

I Wrote a application that send Email. The Email is a bunch of statistics withs total so i put those in a table.
When I check the Email in Lotus notes 7.0.2. The layout is somehow weird ant it does line break at weird place.
ex: it break numbers at the lats digits when they are to large :
19,499.9
9

I try all approch, <nobr></nobr> <td nowarp> and styles but Lotus Notes dosent seem to support those.

But the wrost thing is when I try to print it, it break the table in 2 in the width.
I fixed it by clickig edit, than table properties and setting table width to "fit with margin" But i dont like that manual manipulation.

I didnt put any style or width the <Table> tag
There is any way or guideline to genereate a table that is loking good in lotus notes?

Sjef Bosman

You might try with
<table width="100%">

but Notes is rather special. It also depends on the release of the Notes client that is used: the higher the more HTML-aware.

Printing from Notes has always sucked, just like printing from browsers is never right. It's a difficult subject...

Bill-Hanson

Also, using MIME to create HTML memos provides better results than composing a rich-text memo with pass-thru HTML. Which method are you using?

David Robitaille

ASKER

sjef_bosman,
Thanks for the suggestions, but the table get worse when i add width="100%", the table`s columns dosen`t seem to align anymore... if i check table properties, the table width is now "fit to windows"...
has i said, if i set the table width "fit with margin", the printing is good enough... i think i will try to set a fixed width for the price.
Bill-Hanson,
I don`t know what are you talking about, my app is in asp.net, i`m just building a
System.Net.Mail.MailMessage by setting "IsBodyHtml = True" and writing raw HTML into the body (just a <table>), so i guess I`m composing a rich-text memo with pass-thru HTML.
How could I use MME to create HTML memos?

Bill-Hanson

>> "so i guess I`m composing a rich-text memo with pass-thru HTML"

Nope, it's MIME.

If you post the HTML, we can probably figure out what's going on.

David Robitaille

ASKER

ok, M.I.M.E., i was reading M.M.E... thats make more sense.
I removed some sensitive information, but i think you got the idea, this is a short one, but some managers cand recive mails that contain up to 10 zones and 5 manuf.
I added some column width. it fix the display, but not the printing...

<HTML>
  <BODY>
    <Table style="table-layout:auto" border="1">
      <tr style="font-weight:bold" ><td>&nbsp;</td><td>&nbsp;</td>
        <td width="200">Quote</td><td>Contact</td><td>Tamplate</td><td>Salesperson</td>
        <td width="200" colspan="2">FinalPrice<br />T&I included</td>
        <td width="150">Expiration</td>
      </tr>
      <tr>
        <td rowspan="5">&nbsp;</td>
        <td colspan="8">Zone 1</td>
      </tr>
      <tr>
        <td rowspan="3">&nbsp;</td>
        <td colspan="7">Manuf 1</td>
      </tr>
      <tr><td>
          <a href="http://www.mywebsite.com/Review.aspx?QuoteID=9">XXXX99999999-1</a></td><td>John Smith (Big Company Name)</td><td>Product</td><td>Salesperson</td>
        <td width="150" style="text-align:right">##,###.##</td>
        <td width="50">$  </td>
        <td width="150">Expire in 30 day</td>
      </tr>
      <tr>
        <td colspan="4" style="text-align:right">Sub-Total for Manuf 1</td>
        <td nowrap style="text-align:right">##,###.##</td><td>$</td><td>&nbsp;</td>
      </tr>
      <tr>
        <td colspan="5" style="text-align:right">Total for Zone 1</td>
        <td style="text-align:right">##,###.##</td><td>$</td><td>&nbsp;</td>
      </tr>
      <tr>
        <td colspan="9">
          <hr /></td>
      </tr>
      <tr>
        <td rowspan="8">&nbsp;</td>
        <td colspan="8">Zone 2</td>
      </tr>
      <tr>
        <td rowspan="6">&nbsp;</td>
        <td colspan="7">Manuf 2</td>
      </tr>
      <tr><td>
          <a href="http://www.mywebsite.com/Review.aspx?QuoteID=6">XXXX99999999-1</a></td><td>John Smith (Big Company Name)</td><td>Product</td><td>Salesperson</td>
        <td width="150" style="text-align:right">###,###.##</td>
        <td width="50">$  </td>
        <td width="150">Expire in 31 day</td>
      </tr>
      <tr><td>
          <a href="http://www.mywebsite.com/Review.aspx?QuoteID=11">XXXX99999999-1</a></td><td>John Smith (Big Company Name)</td><td>Product</td><td>Salesperson</td>
        <td width="150" style="text-align:right">###,###.##</td>
        <td width="50">$  </td>
        <td width="150">Expire in 30 day</td>
      </tr>
      <tr><td>
          <a href="http://www.mywebsite.com/Review.aspx?QuoteID=39">XXXX99999999-1</a></td><td>John Smith (Big Company Name)</td><td>Product</td><td>Salesperson</td>
        <td width="150" style="text-align:right">###,###.##</td>
        <td width="50">$  </td>
        <td width="150">EXPIRED</td>
      </tr>
      <tr><td>
          <a href="http://www.mywebsite.com/Review.aspx?QuoteID=46">XXXX99999999-1</a></td><td>John Smith (Big Company Name)</td><td>Product</td><td>Salesperson</td>
        <td width="150" style="text-align:right">###,###.##</td>
        <td width="50">$  </td>
        <td width="150">EXPIRED</td>
      </tr>
      <tr>
        <td colspan="4" style="text-align:right">Sub-Total for Manuf 2</td>
        <td nowrap style="text-align:right">#,###,###.##</td><td>$</td><td>&nbsp;</td>
      </tr>
      <tr>
        <td colspan="5" style="text-align:right">Total for Zone 2</td>
        <td style="text-align:right">#,###,###.##</td><td>$</td><td>&nbsp;</td>
      </tr>
      <tr>
        <td colspan="9">
          <hr /></td>
      </tr>
      <tr>
        <td rowspan="3">&nbsp;</td>
        <td colspan="8">Total For All Zones</td>
      </tr>
      <tr><td>&nbsp;</td>
        <td colspan="4" style="text-align:right">Total for Manuf 1</td>
        <td nowrap style="text-align:right">##,###.##</td><td>$</td><td>&nbsp;</td>
      </tr>
      <tr><td>&nbsp;</td>
        <td colspan="4" style="text-align:right">Total for Manuf 2</td>
        <td nowrap style="text-align:right">#,###,###.##</td><td>$</td><td>&nbsp;</td>
      </tr>
      <tr>
        <td colspan="6" style="text-align:right">Grand Total :</td>
        <td nowrap style="text-align:right">#,###,###.##</td><td>$</td><td>&nbsp;</td>
      </tr>
    </Table>
  </BODY>
</HTML>

Open in new window

Bill-Hanson

I think that the problem is the extensive use of colspan and rowspan. I usually get better results using nested tables for layout.

David Robitaille

ASKER

ok, i see, i will gie a try on that

David Robitaille

ASKER

here the lost "V"
gie=give

David Robitaille

ASKER

OK, I just try nested tables, and it get worse.

The price alignment get screwed up. i try to fix the it with fixed column width, but it`s useless
it does not change anything to the price problem.
it does not change anything to the table with split on print.

Maybe I was not clear enough, The table column and row display correctly; it`s the table width and column width that are wierd.

Some column do unwanted page break (ex : price) I fix that on the display (on Notes) by fixing some column width but seem ignored on printing.
The table width is to large it is splited on 2 page in the width whan i print, i need a way to set the table width to "fit with margin"

Bill-Hanson

OK, I just created a small C# project that sends your HTML sample from above using MailMessage and SmtpClient.

The image below is what I see when I open the email in the Notes client (7.0.2). Based on the HTML, this is what I expected to see. Also, the printed copy was identical to the display in the Notes client.

Here are a couple of things to think about:

1) The nowrap attribute was deprecated in HTML 4.
2) If the Notes client did obey the nowrap attribute, your columns would no longer be aligned.
3) I would abandon the nowrap attribute and fix the width of every column so that you are sure no wrapping will occur.
4) I have no idea why the printed copy displays out differently on your client - mine were identical.

MimeEmail.gif

David Robitaille

ASKER

ok, thanks for your efforts.
for 1,2 and 3, the nowrap attributes are "remains" of testing, i did not use it anymore. Has i said in the question i tested <nobr></nobr> <td nowarp> and styles (css), i also tested <pre></pre> without success.
for 4, it look like a printer driver thing. but the most important thing, does i fit on a page in width???

Bill-Hanson

>> "i tested <nobr></nobr> <td nowarp> and styles (css),"

Right, but if any of these did work, then you would have lost control of the display (ie: the display would adjust automatically). I know that might sound like a good thing, but then you would never know if the display would fit on the page.

>> "the most important thing, does i fit on a page in width???"

You can use some tricks here.

1) Quote: # looks like a standard length, so you should be able to precisely set that column width.
2) Contact: this should be your widest column, but should still be a fixed width.
3) Tamplate: it looks like these are pre-defined values. Can you abbreviate? (ie: P=Product). That would allow you to reduce that column width to a single charachter.
4) Salesperson: same as Tamplate.
5) Price: I would just make sure that this column can hold a very large value.
6) Expiration: same as Tamplate.

David Robitaille

ASKER

ok, but then, with all fixed columns, the table will not "span" in the case of the reading in a mail. I already solved the number problems by fixing the width, but i need the contact and template to be ajustable.
What i need is a way to tell Notes that the table width need to be to "fit with margin". Do you know any way to do this?

SOLUTION

Sjef Bosman

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER CERTIFIED SOLUTION

Bill-Hanson

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

David Robitaille

ASKER

Ok, thanks to both of you, i think I got all the information i need.