Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Градиент с надписью / 5 сообщений из 5, страница 1 из 1
27.07.2009, 14:55
    #36111124
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Градиент с надписью
Градиентов несколько разной ширины, но пытаюсь их сделать помощью одной картинки высотой 1px. С помощью background-image не получится, бекграунды не растягиваются. Делаю так:
Код: plaintext
1.
2.
3.
<td height= 33 >
	<img width= 100 % height=30px src="img/grad_h.gif" style="position:absolute">
	<div style="position:relative;">Текст</div>
</td>
Это работает только в IE, в остальных броузерах ширина картинки считается относительно body, а не контейнера, поэтому если картинка не прижата к левому краю, то получается так (скроллить вправо).

Как это сделать кроссброузерно?


Jah loves you.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.07.2009, 17:13
    #36111624
Max Pro
Max Pro
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Градиент с надписью
AntonariyГрадиентов несколько разной ширины, но пытаюсь их сделать помощью одной картинки высотой 1px. С помощью background-image не получится, бекграунды не растягиваются. Делаю так:
Код: plaintext
1.
2.
3.
<td height= 33 >
	<img width= 100 % height=30px src="img/grad_h.gif" style="position:absolute">
	<div style="position:relative;">Текст</div>
</td>
Это работает только в IE, в остальных броузерах ширина картинки считается относительно body, а не контейнера, поэтому если картинка не прижата к левому краю, то получается так (скроллить вправо).

Как это сделать кроссброузерно?


Jah loves you.
это из-за style="position:absolute"
Или в пикселях считай или через style="background: url(img/grad_h.gif) repeat-x"
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.07.2009, 17:27
    #36111676
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Градиент с надписью
Я знаю из-за чего это. И еще знаю, что repeat-x ни к селу ни к городу. По горизонтали нужно растягивать, а не тайлить.
Я не знаю как градиент с надписью сделать резиновым кроссброузерно.

Jah loves you.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.07.2009, 05:50
    #36112392
illion
illion
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Градиент с надписью
Antonariy,

можно попробовать наоборот сделать, раз у тебя высота фиксированная. Типа такого:
Код: plaintext
1.
2.
3.
4.
5.
<td height="33">
	<div style="position:relative">
		<img width= 100 % height=30px src="img/grad_h.gif" style="position:relative">
		<div style="position:absolute; top:0; left:0;">Текст</div>
	</div>
</tr>
П.С. добавила оберточный див, т.к. по-моему у ФФ были затруднения с абсолютным позиционированием относительно ячейки... Впрочем, могу в этом ошибаться.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.07.2009, 11:35
    #36112849
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Градиент с надписью
Сработало. )
Я почему-то думал, что absolute считается всегда относительно body, если заданы координаты.

Jah loves you.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Градиент с надписью / 5 сообщений из 5, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 451ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1454459]:
 0ms
get settings:
 9ms
get forum list:
 10ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 83ms
get topic data:
 49ms
get forum data:
 3ms
get page messages:
 52ms
get tp. blocked users:
 1ms
others: 238ms
total:  451ms
x
x
Закрыть


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