JSFiddle - React, Tailwind, and code Playground

by eleonore

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Хлебные крошки</title>
    </head>

<body>
<ul class="menu">
<li><a href="">Uno</a></li>
<li><a href="">Dos</a></li>
<li><a href="">Tres</a></li>
<li><a href="">Quatro</a></li>
</ul>

</body>
</html>

CSS

.menu{border-radius:0 30px 30px 0;
-moz-border-radius:0 30px 30px 0;
-ms-border-radius:0 30px 30px 0;
-o-border-radius:0 30px 30px 0;
-webkit-border-radius:0 30px 30px 0;background: #e4efc0; background:-moz-linear-gradient(top, #e4efc0 0%, #e7fccc 35%, #e4efc0 54%, #abbd73 99%);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#e4efc0), color-stop(35%,#e7fccc), color-stop(54%,#e4efc0), color-stop(99%,#abbd73));
background:-o-linear-gradient(top, #e4efc0 0%,#e7fccc 35%,#e4efc0 54%,#abbd73 99%);
background: -ms-linear-gradient(top, #e4efc0 0%,#e7fccc 35%,#e4efc0 54%,#abbd73 99%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4efc0', endColorstr='#abbd73',GradientType=0 );}
.menu li{display:inline-block; list-style:none; padding:11px; padding-right:40px;
width:30px;
 border-right:2px solid #FFF;
box-shadow:3px 0px 2px #999;
-moz-box-shadow:3px 0px 2px #999;
-o-box-shadow:3px 0px 2px #999;
-webkit-box-shadow:3px 0px 2px #999;
border-radius:20px;
-moz-border-radius:20px;
-ms-border-radius:20px;
-o-border-radius:20px;
-webkit-border-radius:20px;}
.menu a{padding:20px;color:#333; text-decoration:none;}