фон Позиционирование изображения после текста

Я хочу, чтобы, как это [фон IMG] [текст] [фон Img2]фон Позиционирование изображения после текста

Это мой код:

HTML

<table border:0> 
    <tr> 
     <td><span class="img-left"></span><span class="text-img">My Text is here</span><span class="img-right"></span></td> 
     <td><span class="img-left"></span><span class="text-img">My Text2 is here</span><span class="img-right"></span></td> 
    </tr> 
</table>

CSS

.img-left{ 
    background: transparent url('left-img.PNG') left center no-repeat; 
    width:23px; 
    height:24px; 
    position:relative; 
    z-index: 99; 
} 
.img-right{ 
    background: transparent url('right-img.PNG') right center no-repeat; 
    width:23px; 
    height:24px; 
    position:relative; 
    z-index: 99; 
} 
.text-img{ 
    margin:0px 0px 0px 0px; 
    padding: 0px 0px 0px 23px; 
}

Th е результат: [img1 & 2] [текст], но я хочу [img1] [Текст] [img2]

Любой помочь?

источник

2013-12-08 john

Почему вы не просто используете тег для представления изображений? – BuddhistBeast

@BuddhistBeast: если я использую тег , текст будет внизу, а верхнее изображение, я попробую использовать выравнивание по вертикали, но не получится, потому что этот код использует редактор wysywig ,,, поэтому вывод использует фоновое изображение – john

Эй , проверьте это. Возможно, я решил проблему с изображением! Дайте мне знать, если это сработает! http://jsfiddle.net/GCbGs/ – BuddhistBeast

Вы можете сделать это с помощью только td и .text-img элементов, поставив на них фоны. Использование «обивка левого and обивки-right` на два элементов будут толкать текст для предотвращения перекрытия: Demo

Использования right вместо left на праве изображения заставит его правую сторону элемента.

источник

2013-12-08 02:23:40 brouxhaha

фон Позиционирование изображения после текста

ответ

Смежные вопросы