XHTML Установка разрывов строк для нескольких тегов привязки с несколькими изображениями внутри - PullRequest
Новая
       18

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

0 голосов
/ 14 декабря 2010

Учитывая этот пример кода: 

<div style="width:300px;">
   <a href="#">
      <img src="images/bracket_open.png"/>
      <img src="images/1.png"/>
      <img src="images/bracket_close.png"/>
   </a>
   <a href="#">
      <img src="images/bracket_open.png"/>
      <img src="images/2.png"/>
      <img src="images/bracket_close.png"/>
   </a>
   <a href="#">
      <img src="images/bracket_open.png"/>
      <img src="images/3.png"/>
      <img src="images/bracket_close.png"/>
   </a>
</div>

В основном это длинный список якорных тегов, которые содержат несколько тегов изображений (из-за шрифта), которые составляют что-то вроде [1] [2] [3] и т. Д.

Как сделать так, чтобы разрывы строк возникали только между тегами привязки, а не между тегами изображения внутри тегов привязки.

Я бы предпочел решение XHTML / CSS, а не JavaScript, если таковоесуществует.

Спасибо.

1 Ответ

1 голос
/ 14 декабря 2010

Простой Nowrap не работает? 

div a {
    white-space:nowrap;
    }

С HTML, как 

<a href="#"><span>[</span><span>1</span><span>]</span></a><a href="#"><span>[</span><span>2</span><span>]</span></a><a href="#"><span>[</span><span>1</span><span>]</span></a>...

Вы также можете использовать: 

div a {
    float:left;
    white-space:nowrap;
    }

Но это не очень элегантноиз-за того, что встроенные элементы плавают без веской причины.

...