Вопрос

Situation


I am using Aristo as my jQuery UI theme. It works just fine, but when it comes to display tooltips, they cover 100% of the page width.

I don't have this particular issue with other themes. So I inspected Aristo.css in which I didn't find anything related to the tooltip's width unfortunately.

Here is how I initialize the jQuery tooltips:

jQuery(document).ready(function() {
}).tooltip();

Updates


07.04

It appears that Aristo completely removes style for the jQuery tooltip only. The default tooltips are working fine.

Hence the tooltip get a default width of 100%, no padding also.

07.05

Image showing the issue

Это было полезно?

Решение

I see the problem, Aristo theme doesn't remove tooltip's styles. Actually it doesn't provide css style for tooltip, that's why the style is missing.

So you should at least add this to your css file then:

.ui-tooltip {
    padding: 8px;
    position: absolute;
    z-index: 9999;
    max-width: 300px;
    -webkit-box-shadow: 0 0 5px #aaa;
    box-shadow: 0 0 5px #aaa;
}
body .ui-tooltip {
    border-width: 2px;
}
/* Copied from jQuery UI css */

Hope this helps ;)

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top