Pergunta

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

Foi útil?

Solução

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 ;)

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top