Как правильно реализовать свойства в карточке товара?

Question

[Кирилл Резанов]

Всем привет, возможно, глупый вопрос, но я не знаю как написать запрос в интернете, чтобы найти решение. Думаю, те, кто делал интернет-магазины с этим сталкивались, так вот, как сделать вот это?

Нужно: название свойства товара, потом точки и значение, как реализовать эти точки правильно?

Answer 1

[Pashok Doom]

https://codius.ru/articles/Как_сверстать_оглавлени...

Answer 2

[Антон Литвиненко]

Если фон однородный, то можно как-то так например

<div class="cart-option">
	<div class="option-item name">White Gold</div>
	<div class="option-item value">$90</div>
</div>

.cart-option {
	width: 100%;
	display: flex;
	justify-content: space-between;
	position: relative;
	margin-bottom: 5px;
	&::before {
		content: "";
		width: 100%;
		height: 1px;
		border-bottom: 2px dotted #C9C9C9;
		position: absolute;
		left: 0;
		bottom: 7px;
	}
	.option-item {
		padding: 0 3px;
		background-color: #fff;
		position: relative;
		z-index: 1;
		font-size: 16px;
		font-weight: 400;
		color: #818181;
	}
	.value {
		font-weight: 700;
	}
}