Неправильно отображается рейтинг 10 звезд

вопрос

Неправильно отображается рейтинг 10 звезд.
Искал ошибку в css.. но что-то не нашел. Может чей-нибудь более опытный взгляд увидит ошибку ^_^
Ну вот:

Код с engine.css

/* 
 * ========================================
 * Рейтинг 
 * ========================================
 */

.rating {
color: #fff;
display: block;
font:14px/14px Cuprum;
height: 62px;
margin: 0;
font-weight: bold;
width: 260px;
padding: 0px 10px;
}
.unit-rating {
list-style: none;
margin:0 auto;
padding: 0px;
width: 264px;
height: 25px;
position: relative;
background-image: url(../dleimages/ratingv.png);
background-position: 0 -54px;
background-repeat: repeat-x;
}
.unit-rating li {
text-indent: -90000px;
padding: 0px;
margin: 0px;
float: left;
}
.unit-rating li a {
display: block;
width: 26.4px;
height: 27px;
top:1px;
text-decoration: none;
text-indent: -9000px;
z-index: 17;
position: absolute;
padding: 0px;
}
.unit-rating li a:hover {
background-image: url(../dleimages/ratingv.png);
background-position: 0 -27px;
z-index: 2;
left: 0px;
}
.unit-rating a.r1-unit { left: 0px; }
.unit-rating a.r1-unit:hover { width: 26.4px; }
.unit-rating a.r2-unit { left: 26.4px; }
.unit-rating a.r2-unit:hover { width: 52.8px; }
.unit-rating a.r3-unit { left: 52.8px; }
.unit-rating a.r3-unit:hover { width: 79.2px; }
.unit-rating a.r4-unit { left: 79.2px; }
.unit-rating a.r4-unit:hover { width: 105.6px; }
.unit-rating a.r5-unit { left: 105.6px; }
.unit-rating a.r5-unit:hover { width: 132px; }
.unit-rating a.r6-unit { left: 132px; }
.unit-rating a.r6-unit:hover { width: 158.4px; }
.unit-rating a.r7-unit { left: 158.4px; }
.unit-rating a.r7-unit:hover { width: 184.8px; }
.unit-rating a.r8-unit { left: 184.8px; }
.unit-rating a.r8-unit:hover { width: 211.2px; }
.unit-rating a.r9-unit { left: 211.2px; }
.unit-rating a.r9-unit:hover { width: 237.6px; }
.unit-rating a.r10-unit { left: 237.6px; }
.unit-rating a.r10-unit:hover { width: 264px; }
.unit-rating li.current-rating {
background-image: url(../images/ratingv.png);
background-position: 0px 0px;
width:0px;
position: absolute;
height: 15px;
display: block;
text-indent: -9000px;
z-index: 1;
}

.rating_digits{
/*font-size: 12px;*/
line-height: 9px;
height: 26px;
width: 334px;
margin-top: 6px;
}

.rating_digits div{
display: inline-block;
}



.rating_digits_1{
position:relative;
left:6px;
background:#DD0000;
margin: 0px;
padding: 8px;
/*width: 152px;*/
height: 10px;
}

.rating_digits_2{
position:relative;
left:10px;
background:#0096FF;
margin: 0px 0px 0px 6px;
padding: 8px;
/*width: 165px;*/
height: 10px;
}

Код из function.php

function ShowRating($id, $rating, $vote_num, $allow = true) {

global $lang;

    if( $rating ) $rating = round( ($rating / $vote_num), 0 );
    else $rating = 0;
    $rating1 = str_replace( ",", ".", $rating );
    $rating2 = $rating1 * 10;

if( ! $allow ) {

$rated = <<<HTML
<div class="rating">
<ul class="unit-rating">
<li class="current-rating" style="width:{$rating2}%;">{$rating2}</li>
</ul>
<div class="rating_digits"><div class="rating_digits_1">Рейтинг: {$rating1} из 10</div><div class="rating_digits_2">Голосов: {$vote_num}</div></div></div>
HTML;

return $rated;
}

$rated .= <<<HTML
<div id='ratig-layer-{$id}'><div class="rating">
<ul class="unit-rating">
<li class="current-rating" style="width:{$rating2}%;">{$rating2}</li>
<li><a href="#" title="1" class="r1-unit" onclick="doRate('1', '{$id}'); return false;">1</a></li>
<li><a href="#" title="2" class="r2-unit" onclick="doRate('2', '{$id}'); return false;">2</a></li>
<li><a href="#" title="3" class="r3-unit" onclick="doRate('3', '{$id}'); return false;">3</a></li>
<li><a href="#" title="4" class="r4-unit" onclick="doRate('4', '{$id}'); return false;">4</a></li>
<li><a href="#" title="5" class="r5-unit" onclick="doRate('5', '{$id}'); return false;">5</a></li>
<li><a href="#" title="6" class="r6-unit" onclick="doRate('6', '{$id}'); return false;">6</a></li>
<li><a href="#" title="7" class="r7-unit" onclick="doRate('7', '{$id}'); return false;">7</a></li>
<li><a href="#" title="8" class="r8-unit" onclick="doRate('8', '{$id}'); return false;">8</a></li>
<li><a href="#" title="9" class="r9-unit" onclick="doRate('9', '{$id}'); return false;">9</a></li>
<li><a href="#" title="10" class="r10-unit" onclick="doRate('10', '{$id}'); return false;">10</a></li>
</ul>
<div class="rating_digits"><div class="rating_digits_1">Рейтинг: {$rating1} из 10</div><div class="rating_digits_2">Голосов: {$vote_num}</div></div></div></div>
HTML;

return $rated;
}

Изменения в rating.php проводились.

Пикча

Ответа пока нет

2 комментария

Юзер

nordulan - 2015-03-145 ноября 2013 14:33 - #18725

ааа блин.. уже заколебался с ним.. -_-
Никак не получается. Поочередно по удалял все css, ничего.
Вроде вся проблема в

.unit-rating li.current-rating {
background-image: url(../images/ratingv.png);
background-position: 26px 0px;
position: absolute;
height: 15px;
width:0px;
text-indent: -9990px;
z-index: 1;
}

но не факт :с