6
У меня есть реагирующий таблицу в твиттер-загрузчике, и я хочу знать, если это возможно, чтобы добавить центрированную строку в нижней части «numberCircle», как на картинке:Добавить вертикальную линию вниз CSS
Спасибо
.numberCircle {
border-radius: 50%;
width: 50px;
height: 50px;
background: rgba(177, 207, 219, 1);
color: white;
text-align: center;
line-height: 50px;
font-weight: 600;
font-size: 16px;
margin: 10px 0;
}
<table class="col-md-12 table-condensed cf">
<tbody>
<tr>
<td style="width: 50%; vertical-align: top;">
<div class="title">Title Content</div>
<div class="content">
Quisque porta pulvinar urna, at maximus sapien efficitur ac. Suspendisse tristique blandit tortor eget congue. Nulla sed aliquet enim. Ut quis massa auctor, feugiat dui ut, molestie mi. Ut congue metus ac neque vestibulum, et pharetra neque mattis. Suspendisse
sed purus commodo, sagittis justo non, pretium diam.
</div>
</td>
<td class="text-center" style="width: 50%; vertical-align: top;">
<div class="numberCircle">1</div>
</td>
</tr>
</tbody>
</table>
Если вам нравится использовать для JQuery: добавить « для numberCircle элемента" и изменить селектор CSS. –
Одна небольшая ошибка, можете ли вы выровнять число на самом верху и сделать нижнюю линию 100% высоты? чтобы поместить td tag vertical-align: top; и линия, чтобы иметь полную высоту – Robert
Вы можете, но с различным подходом https://jsfiddle.net/Lg0wyt9u/562/ –