Jump to content
  • 0

Исчезает бэкграунд в конце ссылки


YanaSt
 Share

Question

Такая проблема. Делаю блок с новостями: http://web-diva.ru/Verstka/temp/news.html

В конце ссылки идет стрелка. В ФФ и Опере все нормально. В ИЕ стрелка есть только у ссылки в одну строку. Если строк больше, стрелку не видно. В чем может быть проблема?

html:

                            <div class="news">
<div class="new">
<h4>12 апреля 2010, 11:28</h4>
<a href="#">Состоялся запуск сайта </a>
</div>
<div class="new">
<h4>14 апреля 2010, 14:03</h4>
<a href="#">Состоялся запуск сайта www..ru, Состоялся запуск сайта www..ru</a>
</div>
<div class="new">
<h4>15 апреля 2010, 16:47</h4>
<h5><a href="#">Состоялся запуск сайта www..ru, Состоялся запуск сайта www..ru</a></h5>
</div>
<div class="new">
<h4>12 апреля 2010, 11:28</h4>
<a href="#">Состоялся запуск сайта www..ru</a>
</div>
<div class="new">
<h4>15 апреля 2010, 16:47</h4>
<a href="#">Состоялся запуск сайта www..ru, текст новости. Состоялся запуск сайта www..ru, состоялся запуск сайта www..ru</a>
</div>
</div>

css:

.news {width:313px; float:right;}
.new {width:293px; border-bottom:1px solid #afafaf; padding:19px 15px 19px 5px;}
.new h4 {color:#8f8f8f; font-size:12px; line-height:22px; font-weight:normal;}
.new h5 {text-indent:27px; background: url(../images/pling.png) no-repeat;}
.new h5 a {line-height:27px; background: #99ba03 url(../images/arrow_green.gif) no-repeat right bottom; font-size:12px; font-weight:normal; color:#323232; text-decoration:none; padding-right:17px; *padding-right:0px;}
.new a {position:relative; background: url(../images/arrow_green.png) no-repeat right bottom; font-size:12px; line-height:27px; font-weight:normal; color:#323232; text-decoration:none; padding-right:13px;}
.new h6 {background: url(../images/arrow_green.png) no-repeat right bottom; font-size:12px; line-height:27px; font-weight:normal; color:#323232; text-decoration:none; padding-right:13px; *padding-right:13px;}
.new:hover {background-color:#f0f0f0;}
.new:hover a {background: url(../images/arrow_red.png) no-repeat right bottom; color:#699100;}

Link to comment
Share on other sites

9 answers to this question

Recommended Posts

  • 0

Ну простейший вариант добавить <h5><a href="#">текст <img src="" alt=""></a></h5> или вместо img <span> или еще какой элемент задать ему размеры и уже менять у него бэкграунд...

Edited by stars
Link to comment
Share on other sites

  • 0
Ну простейший вариант добавить <h5><a href="#">текст <img src="" alt=""></a></h5> или вместо img <span> или еще какой элемент задать ему размеры и уже менять у него бэкграунд...

Я вот об этом. Здесь предлагается картику не БГ вставлять, а просто картинкой.

Но как это будет делать потом наполняльщик сайта? Мне нужно просто понять, почему в ИЕ коряво отображается мой код.

Link to comment
Share on other sites

  • 0
Так новости буду добавляться, что будут картинку вставлять??

а они будут писать <h5><a href="#">текст </a></h5> ?)))) если это кмс то нет не каких проблем добавить <img> в код модуля новостей...

Link to comment
Share on other sites

  • 0
поэтому в ИЕ такой глюк? в остальных же нормально все.

;) ну ты жжошь, какое удивление что в остальных браузерах все ок, а в ие глюк, такое не каждый сможет сделать :)

В ие этот бг тоже есть, но он не в конце последнего слова, он в нижнем правом углу, и так ка сама область ссылки туда не доходит, то его невидно.

сделай эти ссылки блочными, и увидишь. Поэтому делай это имгой.

Link to comment
Share on other sites

  • 0

Просто обычно в 6 тупит, а в остальных нормуль. А тут прям во всех, капец.

Ладно, тогда буду картинку вставлять. Хотя как-то мне этот метод не по душе, но что поделать.

Спасибо откликнувшимся!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy