[Solved] Tooltip - not responding to defined size

[Mike]

I am on the build 2026.2.520 and saw the following issue was determined as fixed in this release.

https://github.com/telerik/kendo-ui-core/issues/8434

I have the following tooltip that no longer is responding to the defined size I have set.  This was previously working without issue.

<div class="mt-1">
     <span id="ReconcileTooltip"><span class="badge bg-secondary"><span class="fa-solid fa-magnifying-glass"></span> View Results</span></span>
     <kendo-tooltip name="ReconcileTooltip" filter="span" position="right" height="550" width="850" content-url="@Url.Action("LoadReconcileCounts", "Home")" on-show="RefreshReconcileCounts"></kendo-tooltip>
</div>

Here is the code for the partial view that is loaded for content:

<div>
    <table class="table table-bordered" summary="Show reconcilation percentages by product, match types">
        <thead class="table-primary">
            <tr>
                <td>&nbsp;</td>
                <th colspan="4" scope="colgroup" align="justify">@Localizer["ResultTable_Header"].Value</th>
            </tr>
            <tr>
                <th scope="col">@Localizer["ResultTable_Category"].Value</th>
                <th scope="col">@Localizer["ResultTable_EnrollmentDeduction"].Value</th>
                <th scope="col">@Localizer["ResultTable_EnrollmentContribution"].Value</th>
                <th scope="col">@Localizer["ResultTable_EnrollmentInvoice"].Value</th>
                <th scope="col">@Localizer["ResultTable_PayrollInvoice"].Value</th>
            </tr>
        </thead>
        <tbody>
            ...
        </tbody>
    </table>
</div>

And the javascript for the refresh:

function RefreshReconcileCounts() {
    this.refresh();
}

[Matt]

Hi Mike,

You can try setting `max-width: none` along with your defined width. The newer Kendo styles may be applying a max-width that prevents the tooltip from honoring the size you configured. Basketball Bros

[Mike]

I tried it this way and that did not work.

<kendo-tooltip name="ReconcileTooltip" filter="span" position="right" height="550" width="850" content-url="@Url.Action("LoadReconcileCounts", "Home", new { componentUnitCode, id = Model.BenefitYearCode })" on-show="RefreshReconcileCounts" style="max-width:none;"></kendo-tooltip>

[Neli]

Hi Mike, 

Could you please let me know what the result is when using the workaround suggested in my previous reply? Does the issue still occur:

contentLoad: function (e) {
              $(".k-tooltip.k-popup").width(500).height(500);
            },

Looking forward to your reply.

Regards,

Neli

[Mike]

This workaround does work. Any word on what release will have the full fix?

[Neli]

Hi Mike, 

The fix for the Tooltip with remote content does not respect the width and height sizes has now a milestone set. It will be available with the next 2026 Q4 release as marked in the Feedback Portal item:

- https://feedback.telerik.com/aspnet-core-ui/1717587-tooltip-with-remote-content-does-not-respect-the-width-and-height-size 

Let me know if you have any adittional questions.

Regards,

Neli

[Neli]

Hi Mike,

Thank you very much for contacting us and reporting the issue.

Based on your report, I logged the following item on your behalf in our Feedback Portal:

- https://feedback.telerik.com/aspnet-core-ui/1717587-tooltip-with-remote-content-does-not-respect-the-width-and-height-sizes 

In the meantime, until the issue is fixed, you can try handling the contentLoad event of the component and set the width and height there:

contentLoad: function (e) {
              $(".k-tooltip.k-popup").width(500).height(500);
            },

Here is such an example: https://dojo.telerik.com/lvXLxxYD.

As a token of gratitude for reporting a bug, I have updated your Telerik points.

I remain at your disposal in case you have any additional questions on the matter. 

Regards,
Neli
Progress Telerik