помогите упростить css

Damasc

Участник
Регистрация
5 Мар 2009
Сообщения
174
Реакции
6
Очень нужна ваша помощь.
Помогите упростить вывод моего блока.
как это выглядит сейчас:
PHP:
<div class="ellipsis251">
    <div style="position:absolute; top:0px; right:0px; z-index:999;"> 
     <img src="/images/ellipsis.png"> 
    </div> ТЕКСТ ТЕКСТ ТЕКСТ</div>
в самом css:
PHP:
    .ellipsis251 
    { 
      position:relative; top:0px; left:0px;
      line-height: 1.2em; 
      height: 1.2em; 
      white-space: nowrap; 
      overflow: hidden; 
      text-overflow: ellipsis25; 
      width: 100%; 
      -o-text-overflow: ellipsis25; 
    }
Как сократить мой код до:
PHP:
<div class="ellipsis251">ТЕКСТ ТЕКСТ ТЕКСТ</div>
 
удалить вложенный див. он никак не влияет на текст..или покажи тут
 
<div style="position:absolute; top:0px; right:0px; z-index:999;">
<img src="/images/ellipsis.png">
</div>


Это выкинь.

<img src="/images/ellipsis.png">

А вот это надо вписать бэкграундом сюда:

.ellipsis251
{
position:relative; top:0px; left:0px;
line-height: 1.2em;
height: 1.2em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis25;
width: 100%;
-o-text-overflow: ellipsis25;
}
 
Как эти параметры в css можно применить к изображению бекграунда?

<div style="position:absolute; top:0px; right:0px; z-index:999;">

У меня только с ними картинка ложится поверх текста.

Бекграунд накладывал таким образом:

PHP:
background: url("../images/ellipsis.png") no-repeat right top;
 
покажи пример того, что делаешь или то, что делаешь, потому что у меня наоборот такой код дает текст поверх:

HTML:
<style>
  .ellipsis251 
    { 
      position:relative; top:0px; left:0px;
      line-height: 1.2em; 
      height: 1.2em; 
      white-space: nowrap; 
      overflow: hidden; 
      text-overflow: ellipsis25; 
      width: 100%; 
      -o-text-overflow: ellipsis25; 
	background: url("../images/ellipsis.png") no-repeat right top; 
    }  
</style>
<div class="ellipsis251">
ТЕКСТ ТЕКСТ ТЕКСТ</div>
 
покажи пример того, что делаешь или то, что делаешь, потому что у меня наоборот такой код дает текст поверх:
HTML:
<style>
  .ellipsis251 
    { 
      position:relative; top:0px; left:0px;
      line-height: 1.2em; 
      height: 1.2em; 
      white-space: nowrap; 
      overflow: hidden; 
      text-overflow: ellipsis25; 
      width: 100%; 
      -o-text-overflow: ellipsis25; 
	background: url("../images/ellipsis.png") no-repeat right top; 
    }  
</style>
<div class="ellipsis251">
ТЕКСТ ТЕКСТ ТЕКСТ</div>

Перепутал слегка. Мне нужно чтобы картинка ложилась над текстом. Прошу прощения, что ввёл в заблуждение!
 
Назад
Сверху