Opened 16 years ago
Closed 16 years ago
#1296 closed defect (invalid)
Tooltip in Firefox not using default CSS
Reported by: | marc | Owned by: | bill |
---|---|---|---|
Priority: | high | Milestone: | 0.9 |
Component: | Widgets | Version: | 0.3 |
Keywords: | Cc: | [email protected]… | |
Blocked By: | Blocking: |
Description
I have a customized version of the default dojoTooltip style in my stylesheet. In IE, I have no problem. The attributes are picked up fine. Firefox doesn't seem to pick them up though and the text appears with no borders or background.
If I specify within the table attribute it works but then in IE, it displays one table within the other - the table properties AND the default Tooltip properties.
I'll attach pictures of the same tooltip in both IE and Firefox.
Attachments (2)
Change History (6)
Changed 16 years ago by
Attachment: | menu_ie.bmp added |
---|
comment:1 Changed 16 years ago by
Milestone: | → 0.5 |
---|---|
Priority: | highest → normal |
severity: | critical → normal |
comment:2 Changed 16 years ago by
Cc: | [email protected]… added |
---|
Please attach a testcase. (And also see http://manual.dojotoolkit.org/WikiHome/DojoDotBook/Book45 for instructions on customizing widget look and feel)
comment:3 Changed 16 years ago by
Here is the code snippet in the jsp file which points to the stylesheet (style.css):
<td class="Topnav pad1" colspan="2"> <img id="theImage" src="<root>/button.gif" width="137" height="20" vspace="0" border="0" onMouseOver="this.src='<root>/buttonClicked.gif'" onMouseOut="this.src='<root>/button.gif'"> </img> <div dojoType="Tooltip" connectId="theImage" id="myMenu" href="<root>/file.jsp" cacheContent="false" executeScripts="true" hideDelay="1000" templateCssPath="<root>/style.css"> </div> <script>djConfig.searchIds.push("myMenu");</script> </td>
...and here is the over-riding class description for the Tooltip within style.css:
.dojoTooltip { border-top: solid #EFEBDE 2px; border-left: solid #EFEBDE 2px; border-bottom: solid #736D63 2px; border-right: solid #736D63 2px; background: #A6BBCC; color: black; position: absolute; font-size: xx-small; font-style: italic; text-decoration: none; z-index: 10; padding: 5px 5px 5px 5px; display: block; }
comment:4 Changed 16 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
Your CSS definition doesn't necessarily override the default dojo one. Please follow the instructions in the link I gave above to give your rule precedence (in this case make the pattern "body .dojoTooltip".) and I think it will work for you.
The Tooltip correctly displaying in IE