fade

[-=ZzZ=-]

Фуф

решил написать может кто делал

а то задолбался уже

то в опере рассыпается то в ие не работает

Пытаюсь воссоздать эффект растворения текста выходящего за границы блока

CSS

.block		  {padding:0 0;border:0;margin:0 0;text-align:center;vertical-align:top;width:100%;}
.block_cell	 {padding:0 0;border:0;margin:0 0;text-align:center;vertical-align:top;width:50%;float:left;overflow-x:hidden;overflow-y:hidden;}
.block_data	 {padding:0 0;border:0;margin:0 30 0 9;width:100%;height:22;float:left; clear:left; text-align:left;white-space:nowrap;overflow-x:hidden;overflow-y:hidden;}
.block_stat	 {padding:0 0;border:0;margin:0 0;width:0px;height:22;float:right;clear:right;text-align:right;white-space:nowrap;overflow-x:visible;overflow-y:visible;}
.block_fade	 {padding:0 0;border:0;margin:0 0 0 -50;width:50;height:22;display:inline-block;text-align:right;background-image: url(../_img/bg_block_fade.png);background-position: 0 50%;}

кусок HTML содранный со странички

<div class="block_cell">
	<div>
		<div class="block_stat"><span class="block_fade">7 </span></div>
		<div class="block_data"><a href="?class_id=773" class="data_item"><img src="_img/icons/class_icon_def.png">1-с предприятие</a></div>
		.....</div></div>
<div class='block_cell'>
	<div>
		<div class="block_stat"><span class="block_fade">11 </span></div>
		<div class="block_data"><a href="?class_id=297" class="data_item"><img src="_img/icons/class_icon_def.png">1с: бухгалтерия</a></div></div></div>
		.....</div></div>

в ие span не отображается

в остальных браузерах текст отображается поверх градиентного фона

блоки местами менял никакого эффекта z-index не помогает

[swetlana]

это имелось в виду?

[-=ZzZ=-]

это имелось в виду?

Похоже

счаз буду пробовать

забыл сказать что блок "резиновый"

Надеюсь подойдет

Спасибо за ссылку

это имелось в виду?

Поглядел

на сколько я понял сие создает инлайн элемент следом за блочным

то есть тотже span а с експлорером гемор

крайне желательна "совместимость" с IE7 без js

[swetlana]

можно и без js по тому же принципу, но старые IE не понимают :after, а значит придётся делать дополнительный лишний элемент.

[-=ZzZ=-]

Похоже

счаз буду пробовать

забыл сказать что блок "резиновый"

Надеюсь подойдет

Спасибо за ссылку

Поглядел

на сколько я понял сие создает инлайн элемент следом за блочным

то есть тотже span а с експлорером гемор

крайне желательна "совместимость" с IE7 без js

Блин

снялся с ручника

все заработало IE7 FF Crome Opera как надаааааа

.block_span	 {padding:0 0;border:0;margin:0 0 0 -50;width:50;height:22;position:absolute;display:inline-block;text-align:right;background-image: url(../_img/bg_block_stat.png);background-position: 0 50%;}

найди 10ть отличий ))

[swetlana]

на сколько я понял сие создает инлайн элемент следом за блочным

да?

document.createElement("div");

ну хз… может, конечно, div и инлайновый элемент. Сам чёрт его, этот html, не разберёт. Путают только мозги честным людям.

[-=ZzZ=-]

да?

document.createElement("div");

ну хз… может, конечно, div и инлайновый элемент. Сам чёрт его, этот html, не разберёт. Путают только мозги честным людям.

Я не про Js

js - гемор

я про .after { content

[swetlana]

ну вот и я о том же:

.after, :after — какая разница? А они чего-то выделываются.

Да и автор статьи тоже хорош: пишет чего-то, не проверив, а получается span.

От оно чё оказывается-то!

[-=ZzZ=-]

ну вот и я о том же:

.after, :after — какая разница? А они чего-то выделываются.

Да и автор статьи тоже хорош: пишет чего-то, не проверив, а получается span.

От оно чё оказывается-то!

Ух

вы правы

но

Таким способом всё что хош создать можно

.after {dispaly:inline

не проверял что там создается

))