Please tell me how to solve the background-color between ListBox List Toolbars

Image_1560_1716518856590


There's a background-color between Listbox and Listbox Tool, as shown in the picture


Image_9946_1716518909276


The code is as above


1 Reply

KV Keerthikaran Venkatachalam Syncfusion Team May 24, 2024 03:20 PM UTC

Hi ywchoi,



Thank you for reaching out to Syncfusion Support.


We suspect that you tried to apply the background style to listbox and toolbar items. For your requirements, please refer to the code snippets and sample below.


<SfListBox TValue="string[]" CssClass="listbox1" DataSource="@GroupA" Scope="scope2" TItem="CountryCode" @attributes="listbox1Attr">

        <ListBoxFieldSettings Text="Name"></ListBoxFieldSettings>

        <ListBoxToolbarSettings Items="@Items"></ListBoxToolbarSettings>

    </SfListBox>

<SfListBox TValue="string[]" CssClass="listbox2" Scope="scope1" DataSource="@GroupB" TItem="CountryCode" @attributes="listbox2Attr">

        <ListBoxFieldSettings Text="Name"></ListBoxFieldSettings>

    </SfListBox>

.listbox1 .e-listbox-tool {

        background-color: lightblue;

    }

 

    .listbox1 .e-list-item {

        background-color: lightsteelblue;

    }

 

    .listbox2 .e-list-item {

        background-color: powderblue;

    }


Sample link: https://blazorplayground.syncfusion.com/rXVfNehJoSVUVvFK


If you are still facing issues, could you please share the issue's replicable sample or replicate the issue in our sample with replication steps and a video demonstration? Based on that, we will check and provide you with a better solution quickly. 


Please let us know if you need any further assistance on this.


Regards,

KeerthiKaran K V


Loader.
Up arrow icon