JSFiddle - React, Tailwind, and code Playground

HTML

<div class="breadcrumb">
			<ul>
				
                <li><a href="#">Design&nbsp;Survey</a></li>
                <li class="end">Questions</li>
			</ul>
		</div>

CSS

div.breadcrumb { clear: both; width: 100%; overflow: hidden; padding: 5px 0; background: linear-gradient(to bottom,  #000 0%,#333 100%) !important;  }
div.breadcrumb > ul { width: 980px; margin: 0 auto; list-style-type: none; position: relative; }
div.breadcrumb > ul > li { padding-right: 10px; float: left; background-image: none !important; font-size: 10px; font-weight: normal !important;  }
div.breadcrumb > ul > li > a { color: #00ccff !important; font-size: 11px;}
div.breadcrumb > ul > li > a:after { content: '>'; text-indent: 10px; float: right; color: #fff; text-decoration:none !important; }