Aoccdrnig to a rscheearch at an Elingsh uinervtisy, it deosn't mttaer in waht oredr the ltteers in a wrod are, the olny iprmoetnt tihng is taht frist and lsat ltteer is at the rghit pclae. The rset can be a toatl mses and you can sitll raed it wouthit porbelm. Tihs is bcuseae we do not raed ervey lteter by itslef but the wrod as a wlohe.
<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
<script>
var $feardearg = jQuery.noConflict();
$feardearg(function() {
$feardearg(".Moose-tabs:first").tabs(".Loose:first > div", { history: true });
});
</script>
.Loose h1{
font-family:;
font-size:18px;
line-height:22px;
color:#}
/* root element for tabs */
ul.Moose-tabs {
margin:0 !important;
padding:0;
height:30px;
border-bottom:1px solid #;
}
/* single tab */
ul.Moose-tabs li {
float:left;
padding:0;
margin:0;
list-style-type:none;
}
/* link inside the tab. uses a background image */
ul.Moose-tabs a {
float:left;
font-size:px;
display:block;
padding:1px 10px;
text-decoration:none;
border:1px solid #;
border-bottom:0px;
height:18px;
background-color:#;
color:#;
margin-right:2px;
position:relative;
top:9px;
outline:0;
-moz-border-radius-topleft: 4px;
-webkit-border-top-left-radius: 4px;
border-top-left-radius: 4px;
-moz-border-radius-topright: 4px;
-webkit-border-top-right-radius: 4px;
border-top-right-radius: 4px;
}
ul.Moose-tabs a:hover {
background-color:#;
color:#;
}
/* selected tab */
ul.Moose-tabs a.current {
background-color:#;
border-bottom:1px solid #;
color:#;
cursor:default;
}
/* tab pane */
.Loose div {
display:none;
border:1px solid #;
border-width:0 1px 1px 1px;
min-height:150px;
padding:15px 20px;
background-color:#;
}
<ul class="Moose-tabs">
</ul>
</div>
</div>
.Loose p, a{font-size:12px;line-height:20px;}
.Loose h1{font-size:18px;line-height:22px;}
ul.Moose-tabs {height:30px;}
ul.Moose-tabs a {font-size:12px;padding:1px 10px;height:18px;margin-right:2px;top:9px;}