Question 228924 in CSS Question posted in
Some basic documentation can be found here.

Css – How to customise a MudBlazor Component

So I have a this MudBlazor <MudSelect /> Component and I want to change its display font to .75rem. (Below doesn’t work!)

<MudSelect style="font-size: .75rem!;" T="string" MultiSelection="true" ...

So after the chosen values are selected, and displayed, I would like that text to be much smaller than the default.

I have been struggling with this change, and now wonder if it’s possible and if so how?

Or any similar form of component customisation?

Tags:

2

Answers


  1. 0

    You can target the .mud-select-input CSS class.

    <style>
    .change-only-this .mud-select-input{
    font-size:.75rem;
    }
</style>

<MudSelect Class="change-only-this" T="string" Label="CustomStyle" Variant="Variant.Outlined">
    <MudSelectItem Value="@("Tyrannosaur")" />
    <MudSelectItem Value="@("Henon Rex")" />
</MudSelect>

    In the example above, I add change-only-this class to the MudSelect so that only that component is modified.

    MudBlazor Snippet

    Login or Signup to reply.
  2. 0

    Did you try to simply capitalize the Style attribute?

    <MudSelect Style="font-size: .75rem!;" T="string" MultiSelection="true" ...

    https://mudblazor.com/api/select#properties

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search