Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / CSS Sprites / 17 сообщений из 17, страница 1 из 1
14.03.2013, 12:58
    #38183658
MaximuS_G
MaximuS_G
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
Всем привет. Пытаюсь сделать sprite, да что-то не получается.
Проблема в том, что не работает property 'background-position' для ссылок. Я не понимаю почему. Chrome ее просто перечеркнул и все. Подскажите, пожалуйста, в чем может быть проблема. Может быть какого свойства не хватает. Заранее спасибо!
Код: css
1.
2.
3.
4.
5.
6.
7.
div.action-bar li a {
    background:url(user-actions-bar.png) no-repeat 0px 3px;
}

li a.cabinet {
    background-position: 0px -29px;
}



Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
<div class="action-bar">
	<ul>
		<li><a href="#" class="articles">Статьи</a></li>
		<li><a href="#" class="cabinet">Личный кабинет</a></li>
		<li><a href="#" class="statistics">Статистика</a></li>
		<li><a href="#" class="note">Новая заметка</a></li>
		<li><a href="#" class="exit">Выйти</a></li>
	</ul>
</div>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 13:34
    #38183775
MaximuS_G
MaximuS_G
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
На картине не показано, но если раскрыть свойство 'background-position', то мы увидим следующее:
background-position-x:0px;
background-position-y:-29px;
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 13:42
    #38183788
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
У тебя походу правило 0 -29 перекрыто правилом 0 3. По крайней мере хром так считает. Убери 0 и 3 из div.action-bar li a.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 14:02
    #38183839
MaximuS_G
MaximuS_G
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
AntonariyУ тебя походу правило 0 -29 перекрыто правилом 0 3. По крайней мере хром так считает. Убери 0 и 3 из div.action-bar li a.
Спасибо за предположение, но нет, все равно та же фигня, даже если убрать правильно "0 3". Есть еще идеи? :)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 14:06
    #38183849
Паганель
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
Computed Style что показывает?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 14:43
    #38183944
IDVsbruck
IDVsbruck
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
А разве установка бекграунда позволяется у строчных элементов? - Не вижу, чтобы ссылке указывался block или inline-block. Могу, конечно, ошибаться, но не припоминаю, чтобы когда-то (даже по ошибке) у того же span'а строчного был бекграунд.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 15:52
    #38184109
MaximuS_G
MaximuS_G
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
ПаганельComputed Style что показывает?
Вроде показывает все правильно, но картинка не в измененном положении.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 15:55
    #38184121
MaximuS_G
MaximuS_G
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
IDVsbruckА разве установка бекграунда позволяется у строчных элементов? - Не вижу, чтобы ссылке указывался block или inline-block. Могу, конечно, ошибаться, но не припоминаю, чтобы когда-то (даже по ошибке) у того же span'а строчного был бекграунд.
IDVsbruck , дело в том, что я даже ставил display:block/inline-block property, все равно ничего не изменялось.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 16:23
    #38184182
IDVsbruck
IDVsbruck
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
Еще одно предположение ...
Если бы ты сразу не уточнил, что это Хром, то я бы подумал, что это ФФ, поведение его. Не знаю, почему у них так устроено, но чтобы поменялся background-position, он должен был быть буквально определен в дефолтовом состоянии. Только после этого его можно изменить. Типа такого:
Код: css
1.
2.
3.
4.
5.
6.
7.
8.
div.action-bar li a {
    background-image:url(user-actions-bar.png);
    background-repeat:no-repeat;
    background-position:0px 3px;
}
li a.cabinet {
    background-position:0px -29px;
}


Возможно, в последних версиях Хрома наблюдается такая же фигня ... Почти на полгода потерялся (переключился на другую работу), поэтому не отслеживал изменения.
Попробуй, заработает ли? Все наблюдения пость, интересно.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 16:49
    #38184274
MaximuS_G
MaximuS_G
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
IDVsbruckЕще одно предположение ...
Если бы ты сразу не уточнил, что это Хром, то я бы подумал, что это ФФ, поведение его. Не знаю, почему у них так устроено, но чтобы поменялся background-position, он должен был быть буквально определен в дефолтовом состоянии. Только после этого его можно изменить. Типа такого:
Код: css
1.
2.
3.
4.
5.
6.
7.
8.
div.action-bar li a {
    background-image:url(user-actions-bar.png);
    background-repeat:no-repeat;
    background-position:0px 3px;
}
li a.cabinet {
    background-position:0px -29px;
}


Возможно, в последних версиях Хрома наблюдается такая же фигня ... Почти на полгода потерялся (переключился на другую работу), поэтому не отслеживал изменения.
Попробуй, заработает ли? Все наблюдения пость, интересно.
Сорри что не назвал браузер сразу, просто все время забываю, что они все по разному работают :). В следующий раз сразу буду говорить что за браузер.
Вы оказались правы, поменяв на предложенный Вами вариант объявление repeat и position, Chrome показал, что "0px 3px;" перезатер "0px -29px;". Я убрал дефолтные "0px 3px;", и вроде все заработало! :)
Спасибо! Удачи! :)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 17:24
    #38184352
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
MaximuS_GСорри что не назвал браузер сразуДа ладно, ты скриншот дал. А вот IDVsbruck должно быть стыдно, что его не узнал!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 17:28
    #38184363
MaximuS_G
MaximuS_G
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
AntonariyMaximuS_GСорри что не назвал браузер сразуДа ладно, ты скриншот дал. А вот IDVsbruck должно быть стыдно, что его не узнал!
:)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 17:33
    #38184378
Паганель
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
IDVsbruckЕсли бы ты сразу не уточнил, что это Хром, то я бы подумал, что это ФФ
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 18:16
    #38184477
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
ПаганельIDVsbruckЕсли бы ты сразу не уточнил, что это Хром, то я бы подумал, что это ФФмассированный миссридинг)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.03.2013, 21:26
    #38184738
IDVsbruck
IDVsbruck
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
Ха! Мы, винничане, друг за друга горой!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
15.03.2013, 20:18
    #38186269
Zoria
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
Код: css
1.
2.
3.
div.action-bar li a {  background:url(user-actions-bar.png) no-repeat 0px 3px;}

div.action-bar li a.cabinet { background-position: 0px -29px;}




а так тоже не будет работать?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.03.2013, 01:19
    #38186454
IDVsbruck
IDVsbruck
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
CSS Sprites
Zoria
Код: css
1.
2.
3.
div.action-bar li a {  background:url(user-actions-bar.png) no-repeat 0px 3px;}

div.action-bar li a.cabinet { background-position: 0px -29px;}


MaximuS_G
Код: css
1.
2.
3.
4.
5.
6.
7.
div.action-bar li a {
    background:url(user-actions-bar.png) no-repeat 0px 3px;
}

li a.cabinet {
    background-position: 0px -29px;
}


Хм ... Найдите 3 отличия?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / CSS Sprites / 17 сообщений из 17, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 349ms
Закрыть
start [/forum/topic.php?fid=22&mobile=1&tid=1448586]:
 0ms
get settings:
 7ms
get forum list:
 11ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 43ms
get topic data:
 9ms
get forum data:
 2ms
get page messages:
 44ms
get tp. blocked users:
 1ms
others: 228ms
total:  349ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]