Я пытаюсь использовать иконку themeroller на странице, и она не совпадает с ожидаемой.Если я скажу:
<html>
<head>
<title>Test Page</title>
<link rel="stylesheet" type="text/css" media="screen"
href="/css/ui-lightness/jquery-ui-1.8.17.custom.css" />
</head>
<body>
<div><span class="ui-icon ui-icon-plusthick"></span>Hello World</div>
</body>
</html>
Я бы ожидал увидеть:
+Hello World
Но вместо этого я вижу только:
+
Почему это так?И как получить ожидаемый результат?
Спасибо.
Редактировать 1: я следовал приведенному ниже предложению, чтобы изменить диапазон на два тега (открыть и закрыть, как показано выше)), но это не имело никакого значения.
Соответствующий CSS выглядит следующим образом:
.ui-icon
{
display: block;
text-indent: -99999px;
overflow-x: hidden;
overflow-y: hidden;
background-repeat: no-repeat;
}
.ui-icon
{
width: 16px;
height: 16px;
background-image: url("images/ui-icons_222222_256x240.png");
}
.ui-icon-plusthick
{
background-position: -32px -128px;
}
Я попытался изменить отображение: block на inline-block и другие вещи, но этостановится хуже, если я это сделаю.
Редактировать 3: Неважно, я облажался код, это должно было быть:
<span class="ui-icon ui-icon-plusthick"
style="display: inline-block"></span>Hello World</div>
И это прекрасно работает.(Я с ошибкой "дисплей")