html - an unordered list background filled with 2 colors equally - CSS -

html - an unordered list background filled with 2 colors equally - CSS -

i need fill background of unordered list as black , white sharp colors. how-to? no gradients, 2 colors filling each 50%, horizontally background of unordered list.

thank you.

you should able accomplish using color gradient appropriate stops. have included snippet. though not 100% sure if indeed want. if not, please create requirements little clearer , post have achieved/tried.

edit: sorry said horizontally, changed snippet acommodate that.

class="snippet-code-css lang-css prettyprint-override">ul.two-colors { color: lightblue; background: linear-gradient(to right, black 0%, black 50%, white 50%, white 100%); } div { background: grey; padding: 20px; } class="snippet-code-html lang-html prettyprint-override"><div> <ul class="two-colors"> <li>a</li> <li>b</li> <li>c</li> </ul> </div>

html css html5 css3