1. Feedback
  2. Blazor
  3. 35097

Welcome to the Blazor feedback portal. We’re happy you’re here! If you have feedback on how to improve the Blazor, we’d love to hear it!

  • Check out the features or bugs others have reported and vote on your favorites. Feedback will be prioritized based on popularity.
  • If you have feedback that’s not listed yet, submit your own.

Thanks for joining our community and helping improve Syncfusion products!

1
Vote

CSS selector of font-size for dialog content on mobile devices should not be universal (*)

On desktop browsers, the same component is displayed in the same form regardless of inside or outside the dialog.

However, on mobile devices, the same component is displayed differently.


Since SfDialog includes "e-device" css class on mobile devices, following css rule is applied:

.e-device .e-dlg-content, .e-device .e-dlg-content * {
    font-size: 16px;
}

Also, "font-size" is used as inherited property rather than direct property to the element in most of the time.

The universal CSS selector (*) prevents the inheritance of "font-size" property, so the same component is displayed differently on mobile devices.


This is not problem if "CSS isolation" is utilized or override above rule to "font-size: inherit;" and use "!important" modifier.

However, when it comes to 3rd party component built with foreign CSS library such as "bootstrap", this behavior cannot be changed due to low CSS specificity.


Therefore, a fundamental solution is needed.

  • Provide way to disable "e-device" CSS class on mobile devices.
  • Fix the CSS rule not to use universal CSS selector (*).

Sample codes are attached.