문제

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