JSFiddle - React, Tailwind, and code Playground

by Egor Makarenko

HTML

<div align="center"><table cellspacing="1" cellpadding="2" border="0" class="switches"><tbody><tr><td style="padding-right:7px;" class="pagesInfo">Страница <span class="curPage">1</span> из <span class="numPages">2</span></td><td align="center" class="switchActive">1</td><td align="center" class="switch"><a href="http://testanim.ucoz.ru/forum/2-1-2" class="switchDigit">2</a></td><td align="center" class="switch"><a href="http://testanim.ucoz.ru/forum/2-1-2" class="switchDigit">3</a></td><td align="center" class="switch"><a title="Следующая" href="http://testanim.ucoz.ru/forum/2-1-2" class="switchNext">»</a></td></tr></tbody></table></div>

CSS

.switches {text-shadow:1px 1px #FFF;background:#f3f3f3;height:22px;border:1px solid #CCCCCC;border-top:0px;-webkit-border-bottom-right-radius:3px;-webkit-border-bottom-left-radius:3px;-moz-border-radius-bottomright: 3px;-moz-border-radius-bottomleft:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;}

.switches td {border-left:1px solid #CCCCCC;}
.pagesInfo {padding:0px 7px;font-size:9pt;border-left:none;cursor:default;} 
.switch {width:21px;height:21px;font-size:9pt;} 
.switchActive {background:#EAEBED;font-weight:bold;color:#6E6E6E;width:21px;height:21px;font-size:9pt;cursor:default;} 

a.switchDigit:link, a.switchBack:link, a.switchNext:link {display:block;width:21px;height:19px;padding-top:2px;text-decoration:none;color:#000000;} 
a.switchDigit:visited, a.switchBack:visited, a.switchNext:visited {display:block;width:21px;height:19px;padding-top:2px;text-decoration:none;color:#000000;} 
a.switchDigit:hover,a.switchBack:hover,a.switchNext:hover {background:#EAEBED;display:block;width:21px;height:19px;padding-top:2px;text-decoration:none; color:#000000;} 
a.switchDigit:active,a.switchBack:active,a.switchNext:active {display:block;width:21px;height:19px;padding-top:2px;text-decoration:underline; color:#FF0000;} 

.threadsDetails {padding:2px;height:20px;color:#6E6E6E;}