JSFiddle - React, Tailwind, and code Playground

by Alexey Lisovy

HTML

<ul>
					<li><a href="#">Борщ украинский с пампушками</a></li>
					<li><a href="#">Вареники с печенью в луке с салом</a></li>
					<li><a href="#">Курица, тушенная с галушками</a></li>
				</ul>

CSS

ul
		{
			position: absolute;
			list-style: none;
			margin: 0; padding: 0;
			word-wrap: break-word; /*перенос слов*/
      z-index: 0;
		}
ul a
		{
			display: block;	
      position: relative;
      z-index: auto;
      background: #ffe5e5;
      color: #ca575b;	
			padding: 5px 10px;
      text-decoration: none;
		}
ul a:hover
		{
			background: #8bc6ee; 
			color: #fffcfc; 		
		}
ul a::after
    {
      content: '';
      display: block;
      position: absolute;
      top: 0; bottom: 0; left:0; right:0;
      box-shadow: 0 0 4px #dd9a9a;
      z-index: -1;
    }