htmltooltip size

Mar 18, 2014 at 3:45 PM
Hi,
I'm using this class to display a table that can vary in number of rows. It has been working fine, however when the number of rows and the content is too big, it screw my window. I would like to know how to limit the height of the tooltip so that I don't get that problem.
I have tried different things like:
  1. Changing the CSS: table { width: 850px; height: 100px; }
  2. Changing the tooltip size: htmlToolTip1.MaximumSize = new System.Drawing.Size(880, 50);
  3. Changing the body size.
The CSS tags help to change the table size but even if I change the tooltip height, it shows a white box bigger than the table.

Any help would be very appreciated.

Thank you.
Developer
Mar 19, 2014 at 10:17 AM
can you provide a sample html to help me identify the issue.
thx.
Mar 19, 2014 at 1:47 PM
I have the same issue.
Maximum height does not work properly. It shows a white box bigger than the content.
<style type="text/css">       .cs9BF57410{text-align:justify;text-indent:0pt;margin:0pt 0pt 10pt 0pt;line-height:1}     .cs524CA461{color:#000000;background-color:transparent;font-family:Arial;font-size:8pt;font-weight:normal;font-style:normal;}     .cs2654AE3A{text-align:left;text-indent:0pt;margin:0pt 0pt 0pt 0pt}      </style>      <p class="cs9BF57410"><span class="cs524CA461">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer pharetra dolor diam, sit amet congue quam tempor sit amet. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec ultrices placerat nunc vel posuere. Nam in tincidunt sapien. Proin at nulla a augue accumsan faucibus id sed eros. Sed quis velit id nulla vestibulum volutpat sed interdum metus. Vestibulum mauris nibh, pretium ut vulputate a, venenatis id risus. Fusce porttitor nisl purus, quis condimentum nunc sagittis et.</span></p><p class="cs9BF57410"><span class="cs524CA461">Nam placerat lacus ut arcu gravida, at pellentesque metus pharetra. Sed facilisis odio odio, sit amet auctor urna ultricies at. Morbi sit amet metus eget metus volutpat ultricies et a lectus. Duis placerat felis diam, lobortis cursus elit malesuada ac. Donec luctus leo nec lorem cursus, vitae fermentum ante convallis. Sed quis sagittis turpis. Aenean ultricies leo sagittis fringilla iaculis. Integer blandit vel ligula sit amet gravida. Nunc at pellentesque urna, ut cursus nisl. Curabitur vitae tincidunt nibh. Vivamus pharetra turpis in urna hendrerit lacinia. Aliquam condimentum, tortor vel venenatis dignissim, nunc diam adipiscing felis, a pharetra augue augue sit amet odio. Etiam cursus, nisi et facilisis vestibulum, nunc odio bibendum erat, non convallis enim turpis ac ligula. Aenean vitae laoreet orci. In eu volutpat tortor. Fusce hendrerit erat nisl, ut tristique neque bibendum eget.</span></p><p class="cs9BF57410"><span class="cs524CA461">Vivamus nunc ligula, ornare nec venenatis quis, faucibus a magna. Etiam dignissim feugiat tincidunt. Suspendisse vehicula lectus lacus, vel auctor neque blandit vel. Etiam ultrices vulputate odio, vitae congue mi suscipit eu. In quis mauris nisi. Suspendisse sit amet libero facilisis, hendrerit turpis eget, pellentesque mi. Curabitur laoreet nunc sit amet neque adipiscing aliquam. Nulla facilisi. Ut placerat purus augue, at consequat mi ultricies nec. Pellentesque eget sodales urna. Pellentesque in fringilla nunc. Aenean euismod elementum enim, vel blandit sem ultricies eu.</span></p><p class="cs9BF57410"><span class="cs524CA461">Sed quis fermentum neque. Ut sit amet arcu vitae purus dictum luctus a sed felis. Sed in massa quam. Sed ac eros at dui lobortis sollicitudin ac sed nulla. Etiam euismod quam bibendum elit placerat, at porta felis euismod. Phasellus rhoncus magna ac pulvinar aliquet. Pellentesque dapibus rutrum egestas. Duis risus quam, rhoncus vel neque eu, iaculis mollis ligula. Donec at risus cursus, interdum libero sed, faucibus turpis. Cras ullamcorper sapien elit, eget auctor diam eleifend at. Proin elementum, leo non pretium ultrices, lectus neque commodo massa, non dictum odio turpis at massa. Aliquam erat volutpat.</span></p><p class="cs2654AE3A"><span class="cs524CA461">Mauris ut est non turpis ornare hendrerit. Ut lacus lacus, lobortis quis dictum ac, mattis pharetra ante. Morbi ut iaculis leo. Aliquam consequat dapibus viverra. Nam aliquam dignissim mauris, non lacinia dolor interdum nec. Integer pretium, neque a malesuada sodales, odio mauris interdum arcu, at malesuada dui dui vel enim. Fusce in nulla vitae velit lacinia commodo sed eget orci. Donec luctus nulla in tempor pretium. Mauris tristique nisi sed diam rutrum, non ornare quam posuere. Vestibulum sagittis justo a nibh adipiscing dignissim. Maecenas volutpat purus odio, sit amet facilisis erat dignissim sed. Integer ligula felis, tempus quis nibh ut, porta accumsan diam.</span></p>
Mar 19, 2014 at 1:59 PM
I've removed any HTML/CSS stuff from text and it does not work event with just plain text.

Image
Mar 19, 2014 at 2:07 PM
This is the HTML I'm working on:

<html>
<body bgcolor=#ffffe0>
    <table border=1>
        <tr><td><b>Header 1</b></td><td><b>Header 2</b></td><td class=comment><b>Header 3</b></td><td><b>Header 4</b></td></tr>
        <tr><td>Content</td><td>Anaphylaxis</td><td class=comment> </td><td>Jan 17 2014 20:44</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching, SOB / Wheezing, Tachycardia / Palpitations</td><td class=comment> </td><td>Jan 17 2014 20:44</td></tr>
        <tr><td>Content</td><td>Anaphylaxis, Rash / Hives / Itching, SOB / Wheezing</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content</td><td>Rash / Hives / Itching, SOB / Wheezing, Tachycardia / Palpitations, Other</td><td class=comment>Y</td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content Content</td><td>Confusion / Agitation, Hallucination / Delirium, SOB / Wheezing</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content</td><td>Rash / Hives / Itching, SOB / Wheezing</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Bleeding Disorders, Confusion / Agitation, Nausea / Vomiting</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching, Seizures, SOB / Wheezing, Tachycardia / Palpitations</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content  Content</td><td>Rash / Hives / Itching, SOB / Wheezing, Tachycardia / Palpitations</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching, SOB / Wheezing</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content</td><td>Rash / Hives / Itching, SOB / Wheezing</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching, SOB / Wheezing, Other</td><td class=comment>Y</td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content</td><td>Rash / Hives / Itching, SOB / Wheezing</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Anaphylaxis, Diarrhea</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching, SOB / Wheezing</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content</td><td>Anaphylaxis</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Anaphylaxis, Bleeding Disorders, Confusion / Agitation, Constipation, Diarrhea, Hallucination / Delirium, Headache / Photosensitivity, Nausea / Vomiting, Rash / Hives / Itching, Seizures, SOB / Wheezing, Tachycardia / Palpitations, Other</td><td class=comment>Y</td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Anaphylaxis, Rash / Hives / Itching, SOB / Wheezing, Tachycardia / Palpitations</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Unknown</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content/Content</td><td>SOB / Wheezing, Tachycardia / Palpitations</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Anaphylaxis, Other</td><td class=comment>Y</td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Hallucination / Delirium, Headache / Photosensitivity, Rash / Hives / Itching, Seizures, SOB / Wheezing, Tachycardia / Palpitations</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content</td><td>Rash / Hives / Itching, SOB / Wheezing, Tachycardia / Palpitations</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content Content Content</td><td>Anaphylaxis, Rash / Hives / Itching</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching, SOB / Wheezing</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching, SOB / Wheezing</td><td class=comment>Y</td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
        <tr><td>Content  [Content/Content]</td><td>SOB / Wheezing</td><td class=comment> </td><td>Jan 29 2014 10:58</td></tr>
        <tr><td>Content Content Content  [Content Content/Content/Content/Content]</td><td>Confusion / Agitation, Hallucination / Delirium</td><td class=comment> </td><td>Jan 29 2014 10:58</td></tr>
        <tr><td>Content</td><td>Rash / Hives / Itching</td><td class=comment> </td><td>Jan 14 2014 13:03</td></tr>
    </table>
</body>
</html>

And this is my BaseStyleSheet:
".tooltipcss html body {margin: 2px; padding: 1px; border: solid gray 1px} table {font-size: 10px; width: 880px; hight: 400px; } tr td {border: 1px gray; padding: 2px 4px 2px 4px } td.comment {text-align: center ;} "

Thanks.
Developer
Mar 22, 2014 at 11:16 AM
will be fixed in next minor release.

as a quick fix you can change the set of ToolTipSize in HtmlToolTip.OnToolTipPopup method to:
//Set the size of the tooltip
e.ToolTipSize = new Size((int)Math.Ceiling(Math.Min(_htmlContainer.ActualSize.Width, MaximumSize.Width)),
                                     (int)Math.Ceiling(Math.Min(_htmlContainer.ActualSize.Height, MaximumSize.Height)));
Mar 24, 2014 at 1:56 PM
Hi Arthur,

Do you mean override Popup method? in my case it would be "private void htmlToolTip1_Popup(object sender, PopupEventArgs e) { }

On the other hand, when I add this code to that method I get this error:
Error 9 The name '_htmlContainer' does not exist in the current context.

Thanks.
Developer
Mar 24, 2014 at 4:14 PM
Sorry, I mean to change the code of the HTML Renderer and recompile, there is no other way until I release an update.
Mar 24, 2014 at 5:04 PM
I see. What version of Visual Studio are you using? I have 2010 and It cannot be opened.
Developer
Mar 25, 2014 at 9:34 AM
I'm using 2012
Mar 26, 2014 at 8:18 PM
Do you know by when the next release is going to be ready?
Developer
Mar 27, 2014 at 7:55 AM
2-3 weeks
Apr 7, 2014 at 4:49 PM
ArthurTep wrote:
will be fixed in next minor release.

as a quick fix you can change the set of ToolTipSize in HtmlToolTip.OnToolTipPopup method to:
//Set the size of the tooltip
e.ToolTipSize = new Size((int)Math.Ceiling(Math.Min(_htmlContainer.ActualSize.Width, MaximumSize.Width)),
                                     (int)Math.Ceiling(Math.Min(_htmlContainer.ActualSize.Height, MaximumSize.Height)));
Does not work for me, because MaximumSize can be 0, so Size will be 0 x 0.

Small modification:
            //Set the size of the tooltip
            var desiredWidth = (int)Math.Ceiling(MaximumSize.Width > 0 ? Math.Min(_htmlContainer.ActualSize.Width, MaximumSize.Width) : _htmlContainer.ActualSize.Width);
            var desiredHeight = (int)Math.Ceiling(MaximumSize.Height > 0 ? Math.Min(_htmlContainer.ActualSize.Height, MaximumSize.Height) : _htmlContainer.ActualSize.Height);
            e.ToolTipSize = new Size(desiredWidth, desiredHeight);
Developer
Apr 8, 2014 at 1:34 PM
Shit, I really need to pay more attention :(
Thx, I will add the fix.
Developer
Apr 26, 2014 at 4:10 PM
fixed in 1.4.14.0
Marked as answer by ArthurTep on 4/26/2014 at 9:11 AM