JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://dl.dropboxusercontent.com/s/wqpzbhm57e54m8o/bootstrap.css">
<link rel="stylesheet" href="https://dl.dropbox.com/s/2nz3920ufsje4ej/bootstrap-theme.css">
<!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>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="site">
	<div id="menu">
        	<ul id="li-menu">
        	<li><a href="#">صفحه اصلی</a></li>
    		<li><a href="#">عضویت</a></li>
            <li><a href="#">ورود</a></li>
    		<li><a href="#">قوانین</a></li>
            </ul>
    </div>



</div>
</body>
</html>

CSS

/************** selection *******************/
::selection {
 background:#f4b300 ;
 color:#fff;
}
::-moz-selection {
 background:#f4b300 ;
 color:#fff;
}
::-webkit-selection {
 background:#f4b300 ;
 color:#fff;
}
/************** selection *******************/
/************** body start *********/
body
{
	direction:rtl;
	background:url(img/bg.png);
}
/************* site ******************/
#site
{
	width:100%;
	height:100%;
	margin: auto;
}
/***************** end site ***************/
/*************** menu ******************/
#menu
{
	width:100%;
	height:45px;
	background:#1b1b1b;

}
ul#li-menu
{
	float:right;
	margin-top:9px;
}

ul#li-menu li
{
	padding-right:7px;
	float:right;	
	list-style:none;
}
ul#li-menu li a
{
  font-size: 16px;
  font-family: "B Nazanin";
  color: rgb( 255, 255, 255 );
  font-weight: bold;
  text-decoration:none;
  padding:6px;
}
ul#li-menu li a:hover
{
 	background:#f64747;
	color:#FFF;
	
}

/***************  end menu ******************/