Troubleshooting CSS
The following troubleshooting items can be investigated if your Custom CSS implementation causes errors.
Problem
The style attribute is not overridden.
Solution
If the widget core definition has an !important or inline style, you might need to set the style from the user interface or use !important in your CSS.
Also, verify if any existing CSS selector has more weight or is more specific than the selector in your custom rule set.
Problem
CSS file from a CSS file repository fail to apply to the mashup.
Solution
Verify that your CSS file is in the file repository and the path to the file is correct.
or
Verify that the CSS file is included in the run time ThingWorx CSS.
Problem
ThingWorx fails to import the extension.
Solution
If the extension is already installed, but you made recent changes, you need to update the version number in the metadata.xml file.
Problem
Recent CSS changes are ignored.
Solution
Clear the browser cache if the CSS is not merged in ThingWorx combined CSS (under debug mode: Hold the Refresh button, and then clear cache).
If the CSS is merged in ThingWorx combined CSS, restart the server and use URL or links in your local server.
Problem
Scroll bars are displayed within the Menu widget in FireFox. The issue is visible when you apply a display: inline-block rule to the container with the widget content.
Solution
To hide the scroll bar, apply the following CSS to the mashup with the widget:
.custom-css-class-name .widget-content {
overflow: hidden;
}
The CSS selectors match the div element with the widget content. Replace custom-css-class-name with the custom CSS class name for the widget to target the Menu widget. The overflow: hidden property forces the browser to hide any scroll bars that are displayed on the container.
Was this helpful?