Как удалить белые пиксели на углах после границы-радиусаHtml

Программисты Html
Ответить
Гость
 Как удалить белые пиксели на углах после границы-радиуса

Сообщение Гость »

Я создал простой неупорядоченный список с округленными углами, при выборе элемента списка я хочу, чтобы фон стал синим, чтобы показать активное состояние. Когда у меня нет границы-радиуса, все выглядит великолепно. < /P>
Однако, когда я использую границу радиуса 4px, чтобы округлить все края, и выбираю последний элемент списка (#5) с закругленными углами внизу, синее активное состояние теперь показывает маленькие белые пиксели на углах. Кажется, я не могу понять, как предотвратить это. Спасибо за помощь. .
http://jsfiddle.net/8pn8z/
кодовый фрагмент:


$(function() {
$('a.tab-link').click(function() {
$('a.tab-link').removeClass('active-tab')
$(this).addClass('active-tab')
});
});< /code>

Код: Выделить всё

.left-dash {
background: #444;
height: 500px;
}

.left-dash div {
-webkit-border-radius: 4px 4px 4px 4px;
border-radius: 4px 4px 4px 4px;
}

.left-dash div ul li:first-child,
.left-dash div ul li:first-child a {
-webkit-border-radius: 4px 4px 0px 0px;
border-radius: 4px 4px 0px 0px;
}

.left-dash div ul li:last-child,
.left-dash div ul li:last-child a {
-webkit-border-radius: 0px 0px 4px 4px;
border-radius: 0px 0px 4px 4px;
}

.dash-stats-3 {
width: 220px;
margin-bottom: 17px;
background: #9f9f9f;
-webkit-background-clip: padding-box;
/* for transparent border with solid bg - Safari */
background-clip: padding-box;
/* for IE9+, Firefox 4+, Opera, Chrome */
border-radius: 0px;
border: 1px solid rgba( 0, 0, 0, 0.15);
box-shadow: inset 0px 0px 2px 0px #FFFFFF, 0px 1px 3px 0px rgba(0, 0, 0, 0.15);
-webkit-box-shadow: inset 0px 0px 2px 0px #FFFFFF, 0px 1px 3px 0px rgba(0, 0, 0, 0.15);
-moz-box-shadow: inset 0px 0px 2px 0px #FFFFFF, 0px 1px 3px 0px rgba(0, 0, 0, 0.15);
-o-box-shadow: inset 0px 0px 2px 0px #FFFFFF, 0px 1px 3px 0px rgba(0, 0, 0, 0.15);
font-family: 'Museo Sans W01 700' san-serif;
font-size: 14px;
color: #828282;
text-shadow: 0px 1px 1px #FFFFFF;
font-weight: normal !important;
}

.dash-stats-3 ul li a,
.dash-stats-3 ul li:first-child {
height: 41px;
border-bottom: solid rgba( 0, 0, 0, 0.15) 1px;
border-top: solid rgba(255, 255, 255, .65) 1px;
}

.left-dash div ul li:last-child,
.left-dash div ul li:last-child a {
border-bottom: none;
}

.dash-stats-3 ul li a {
position: relative;
line-height: 43px;
display: block;
}

.dash-stats-3 ul li a.active-tab {
z-index: 120;
border-top: 1px solid #5b82a7;
background: #4e81be;
/* Old browsers */
}< /code>



[list]
[*]testing
[*]
[url=#]
1 test-1
[/url]

[*]
[url=# ]
2 test-2
[/url]

[*]
[url=/theme/inspiring]
4 test-4
[/url]

[*]
[url=#]
5 test-5
[/url]

[/list]




Подробнее здесь: https://stackoverflow.com/questions/149 ... der-radius
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»