Выравнивание текста по горизонтали с многоточием с помощью кнопки jQuery

Question

Выравнивание текста по горизонтали с многоточием с помощью кнопки jQuery

0

Я пытаюсь горизонтально выровнять текст (w/ellipsis) с помощью кнопки jquery и не могу понять, что происходит.

Вот jsfiddle, отображающий мою проблему:

<span>
    <span id='heading'>Long Heading That Requires Ellipsis</span>
    <span id='hiddenID'>ID</span>
    <button id='closeTab'></button>
</span>

Как вы можете видеть, кнопка выглядит немного смещенной (ниже) от текста, как я могу заставить их отображаться по горизонтали?

Я пробовал возиться с отступом, разметкой, выравниванием по вертикали без успеха, действительно оценил бы какую-нибудь помощь от любого из вас, гуру-гуру! благодарю!

A.O. 11 дек. 2013, в 01:25

Источник

Теги:

jquery

html

css

jquery-ui

vertical-alignment

1 ответ

Ещё вопросы

j08691 · Accepted Answer · 2013-12-10T22-03-00.000Z

Добавьте vertical-align:top до #closeTab:

#closeTab {
    height: 16px;
    width: 16px;
    margin-left:5px;
    vertical-align:top;
}

Пример jsFiddle

аааа спасибо Итак, я понимаю, что здесь происходит, текст по умолчанию был vertical-align:top , а кнопка была по умолчанию vertical-align:bottom ... поэтому они изначально были смещены?
На самом деле вертикальное выравнивание по #heading for the same result. встроенных элементов - это базовая линия, так что вы могли бы поочередно указать vertical-align:top на #heading for the same result. jsfiddle.net/j08691/5bVDu/9