HTML & CSS: текст в одну строку с выравниванием по ширине вправо полностью видимым

Question

HTML & CSS: текст в одну строку с выравниванием по ширине вправо полностью видимым

0

У меня есть вопрос. Это мой код

<div class="comments_item">
  <a href="/post/123">Post 123</a>
  <span> - </span>
  <a href="/author/321">Author</a>
</div>
<div class="comments_item">
  <a href="/post/456">Post 456</a>
  <span> - </span>
  <a href="/author/654">Author</a>
</div>

если заголовок статьи не подходит, это линия обрезания с эллипсисом в конце, означает css. Имя автора должно быть полностью отображено. Если заголовок статьи короткий и помещен в блок, то имя автора должно идти сразу после него. DIV адаптивна!

user3265151 14 май 2014, в 11:57

Источник

2

Можете ли вы предоставить JSFiddle?
user3057089 14 май 2014, в 09:45
0

... и, возможно, попытка самостоятельно?
George 14 май 2014, в 09:45
0

Пожалуйста, будьте ясны. что значит «это линия обрезания с многоточием на конце, значит css»?
Mustafa sabir 14 май 2014, в 09:48
0

s24.postimg.org/hg9xt93d1/image.png
user3265151 14 май 2014, в 09:56

Показать ещё 2 комментария

Теги:

html

css

1 ответ

Ещё вопросы

... и, возможно, попытка самостоятельно?
Пожалуйста, будьте ясны. что значит «это линия обрезания с многоточием на конце, значит css»?

Jonathan · Answer 1 · 2014-05-14T09-51-00.000Z

Вам нужно применить правило белого пробела css (и, возможно, добавить класс к первому тегу привязки)

white-space:nowrap;

к первому якорю: http://css-tricks.com/almanac/properties/w/whitespace/

Пример html-кода:

<div class="comments_item">
  <a class="nowrap" href="/post/123">Post 123</a>
  <span> - </span>
  <a href="/author/321">Author</a>
</div>
<div class="comments_item">
  <a class="nowrap" href="/post/456">Post 456</a>
  <span> - </span>
  <a href="/author/654">Author</a>
</div>

Пример css:

.nowrap{
    white-space:nowrap;
}