Articles in this section
Category / Section

How to Resolve Style Issues in Embedded Applications with External CSS Files

Published:

How to Resolve Style Issues in Embedded Applications with External CSS Files

This article will guide you on how to resolve style issues in embedded applications with external CSS files.

Cause:

When embedding dashboards in your applications, you may encounter style issues caused by external CSS files. This can happen because your application’s CSS styles may conflict with the CSS styles used in the embedded dashboard. When this happens, it can cause UI glitches, such as misaligned text, overlapping elements, or broken layouts.
External CSS Causing Style Issues in Embedded Applications:

image.png

Solution:

As the issue frequently arises, during the investigation, it was found that your embedded application’s external CSS styles were overriding the BoldBI dashboard styles. To prevent this, the following solutions were suggested:

  • Avoid referencing the override file while on the dashboard rendering page.
  • Scope the style properties with prefixes to avoid affecting the dashboard.

By implementing the suggested solutions, you can prevent your application CSS styles from overriding the BoldBI dashboard styles and avoid style issues.

Related Links:
Was this article useful?
Like
Dislike
Help us improve this page
Please provide feedback or comments
NM
Written by Nihal Mohamed Ali
Updated
Comments (0)
Please  to leave a comment
Access denied
Access denied