• 0
yaparoff

Лейбл не прижимается к тексту, когда текст в 2 строки

Вопрос

Есть лейбл. По задумке дизайнера этот лейбл должен прижиматься к тексту и расстояние между лейблом и текстом должно быть 10 пикселей.
Но вот когда текст переноситься это не срабатывает: лейбл прижимается к правому краю. Вот так http://skrinshoter.ru/s/121218/eVuL33Lz
Понятно что дизайнеру не хотелось бы чтоб было так. Но как сделать это чтоб соответствовало его задумке  - хз.

https://codepen.io/anon/pen/OrVBKN

Изменено пользователем yaparoff

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Рекомендованные сообщения

  • 0

Блин, думал получится, но почему-то во втором аётеме, лейбл отталкивается не от размера контейнера, а от размера второй строки в этом контейнере.

https://codepen.io/corvus-007/pen/OrVdqy?editors=1100

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
  • 0
12.12.2018 в 11:44, mrnobody сказал:

... думал получится ...

    не получится)

12.12.2018 в 11:44, mrnobody сказал:

... почему-то во втором аётеме, лейбл отталкивается не от размера контейнера, а от размера второй строки в этом контейнере.

https://codepen.io/corvus-007/pen/OrVdqy?editors=1100

у Вас там не ни какой второй строки! это только так кажется 

в данном примере элементу задан line , то его содержимые - символы, будут: 

    отображаться в одну строку на всю доступную ширину относительно предка 

        и определяя его высоту как высоту строки

    если: предку ширина задана явно

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

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

       но!..: фактически высота элемента в независимости от ширины  будет = одной высоте символа, с учетом  - 

                 - свойств применяемых браузером к символам и предопределённые стили к ним. 

    итог: line элементы имеют высоту самого высокого символа в наборе если значения не указанны абсолютно, 

              то следующий за ним элемент буде отсчитываться последнего символа,

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

...

  этот способ скорее всего не подойдет( 

    

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас