Как прижать к правому краю и сделать разделительную черту?

Question

[Banny_Boom]

Как прижать к правому краю "Удалить" (только float, или абсолютно позиционировать?) - как лучше?

И как сделать разделительную линию между товаром, чтобы её небыло выше 1 элемента и ниже последнего, нужно узнать как-то все между 1 и последним?

Answer 1

[gleendo]

1) Используй float.
2) Делай каждой строчке товара border-bottom. Потом last-child укажи border-bottom: none;

Comments

[Banny_Boom]

Почему именно float ?
Спасибо за помощь)

Answer 2

[Nikolay Talanov]

codepen.io/suez/pen/3ab440ea3764172b866d3f911c3e28... - вот простой вариант.

Comments

[Banny_Boom]

а что за опрератор & ?
Спасибо за помощь)

[Nikolay Talanov]

Banny_Boom: там написано на SASS. В секции css по кнопочке View Compiled, увидите обычный css.

[Banny_Boom]

Nikolay Talanov: А ну да, спасибо большое)

[Banny_Boom]

Nikolay Talanov: Слегка не получается по высоте выравнивать, не могли бы вы посмотреть?
codepen.io/anon/pen/WvqBwZ

[Nikolay Talanov]

Banny_Boom: С выравниваем все не так просто. Если бы высота каждого блока продукта известно - можно выравнивать через line-height равный высоте блока (за вычетом паддинга). Если высота неизвестна, то самый простой способ это использование табличного выравнивания, потому-что вариант с transform: translateY(-50%) сделает текст размазанным.
Еще как вариант можно задавать top: 50% и делать margin-top: -font-size/2 - padding-bottom/2 но это весьма жуткий вариант, и если названия будут длинными и займут 2 строчки, то этот вариант развалится (а вот табличный будет работать).

[Banny_Boom]

Nikolay Talanov: табличные это
родителю - display table
дочернему - display table-cell, vertical-align middle ?

у меня как бы все выравненно, но вот абсолютно позиционированный не могу нормально выравнять, как это сделать если этот элемент вне потока?

[Nikolay Talanov]

Banny_Boom: когда высота неизвестна, лучшие варианты выравнивания текста это либо flexbox, либо табличка (то что вы и написали в уточнении). Попробовал сейчас другие способы - везде проблемы.

[Banny_Boom]

Nikolay Talanov: Хорошо, спасибо )