@VctorIAN

Как сделать высоту картинки равною высоте текста возле неё?

Здравстуйте, я хочу чтоб высота картинки всегда была равной высоте текста, я предполагая что высота div зависит от высоты содержимого и пытаюсь установить эту высоту в картику указав height: 100%; но єто не работает - как я могу исправить проблемму
пример
<!DOCTYPE html>

<body>
	<div class="container">
		<svg xmlns=" http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="#2329D6" stroke-width="1" color="#2329D6">
			<path
				d="M16 12C15.3333333 12.6666667 15 14 15 16L15 17 9 17 9 16C9 14 8.66666667 12.6666667 8 12 5.6739597 9.6739597 5.41421356 6.10050506 7.75735931 3.75735931 10.1005051 1.41421356 13.8994949 1.41421356 16.2426407 3.75735931 18.5857864 6.10050506 18.4068484 9.59315157 16 12zM10 21L14 21" />
		</svg>
		<div class="text">
			<div class="text__first">First</div>
			<div class="text__second">second</div>
		</div>
	</div>
</body>
<style>
	.container {
		display: flex;
		flex-direction: row;
		font-size: 20vmin;

	}

	.text {
		background: green;
	}

	.text__first {
		font-size: 20vmin;
	}

	.text__second {
		font-size: 10vmin;
	}

	svg {
		height: 100%;
	}
</style>

</html>
  • Вопрос задан
  • 508 просмотров
Решения вопроса 1
kryamk
@kryamk
Обычно если надо картинку высотой по тексту то делаю с помощью absolute. Какой-никакой width видимо всегда нужен.
svg соблюдает соотношение сторон, но можно это избежать задав аттрибут preserveAspectRatio="none"
Вот кстати ссылка любопытная, сам не читал, но вроде дело говорят
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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