@IDOL772

Как border прислонить к другому border'у?

6113be9a3e82f391089865.jpeg6113bea93d7d2538952816.jpeg

Подскажите, пожалуйста, какие свойства css нужно задать, чтобы получить результат, как на второй картинке?
Первая картинка - текущий результат.
Стили заданы следующие:

.product_info - внешний блок
.product_specifications - внутренний блок

.product_info {
	border: 1px solid black;
	border-radius: 5px;
	height: 100px;
	margin-top: 10px;
	padding: 0;
	text-align: left;
}

.product_specifications{
	text-align: center;
	border: 1px solid black;
	border-radius: 5px;
	font: bold calc(100vw/70) 'Roboto Condensed', sans-serif;
	padding-left: 3px;
	padding-right: 3px;
	position: relative;
	top: 0;
}


C position вроде как получилось, но если уменьшать разрешение, то внутренний блок .product_specifications улетает вниз
  • Вопрос задан
  • 99 просмотров
Решения вопроса 2
TheSnegok
@TheSnegok
Через position: absolute если ты ещё хочешь чтобы и при уменьшении оно не улетало вниз:
тык
Ответ написан
@andand44
transform: translate(-1px, -1px); Сдвинет .product_specifications влево и вверх на ширину border
.product_specifications{
  text-align: center;
  border: 1px solid black;
  border-radius: 5px;
  font: bold calc(100vw/70) 'Roboto Condensed', sans-serif;
  padding-left: 3px;
  padding-right: 3px;
  position: relative;
  top: 0;
  transform: translate(-1px, -1px);
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
kryamk
@kryamk
outline вместо border можно использовать
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы