Вставьте многоточие в частичный текст внутри тега привязки

<a href="#" >some lengthy text -- 07 May 2014 -- order ID#12345 </a>

У меня есть тег привязки, внутри которого есть какой-то текст, дата, номер (формат текста - даты - числа), как показано выше. Я хочу сделать многоточие только текста в соответствии с out div таким образом, чтобы весь контент привязки (текст, номер, дата) не должны переноситься на новую строку.

В приведенном выше примере я хочу, чтобы многоточие только текст (некоторый объемный текст) не должно беспокоить число и дату

Я пытался положить <p> пометить текст с помощью некоторого CSS-кода, он может правильно сжиматься, но проблема заключается в том, что якорный тег выглядит как состоящий из двух частей. Я не хочу этого http://jsfiddle.net/Vc4N6/3/

Есть ли лучший способ сделать это в JavaScript? так что мне не нужно бороться с CSS(с другим браузером IE8 и 9 должны быть вместе с другим браузером.)

ПРИМЕЧАНИЕ: я не использую JQuery решение должно быть в чистом JavaScript

РЕДАКТИРОВАТЬ:

Я получил решение по вышеупомянутому вопросу, но мое требование немного больше, я буду использовать эти позиции в списке, после добавления в список вводится пробел между текстом и датой, если у меня есть изменяющийся текст в каждой позиции. См. Здесь http://jsfiddle.net/Vc4N6/13/

В идеале должно выглядеть

  • это очень длинный текст длинный текст.. - 07 мая 2014 - код заказа #12345
  • краткий текст - 06 июня 2015 - номер заказа #46453
Источник

2 ответа

Решение

Это ellipsis кстати, не эллипс.

http://jsfiddle.net/Vc4N6/12/

.e {
    overflow: hidden;
    max-width:70px;
    text-overflow: ellipsis;
    white-space:nowrap;
    display: inline-block;
    margin: 0;
    vertical-align: top;
}
Источник

Если я правильно понял вопрос, вы можете сделать это без использования JavaScript, используя display: inline-block, vertical-align: middle, white-space: nowrap и несколько других css реквизита. DEMO

Источник
Другие вопросы по тегам