@Rufix

Как верстать блоки текста в картинке?

Как сверстать такой блок?
5bc25321dba35722452669.png
Насколько я понял, здесь нужно использовать position: absolute и т.д
Сделать фиговинку с "Новинка", на моем разрешении все ок, но когда начинаю зумить то получается такое:
S9ZvpOy.jpg

Просто я с адаптивной версткой еще не знаком и не знаю, нормальное ли это явление..

Вот код как я верстал эту часть:
<section id="new">
			<img class="new-background" src="img/child.png" alt="bg">
			<p class="new-new">Новинка</p>
		</section>

.new-background{
	width: 100%;
	position: absolute;
}

.new-new{
	font-size: 14px;
	text-transform: uppercase;
	position: absolute;
	left:13%;
	background: white;
	padding: 7px 30px;
	top: 120px;
}
  • Вопрос задан
  • 150 просмотров
Пригласить эксперта
Ответы на вопрос 2
kores
@kores
Помог ответ? Отметь решением!
У Вас при зуме все объекты увеличились пропорционально, это нормально. Адаптивная вёрстка предполагает не зум, а другое разрешение экрана. Если вы хотите, чтобы на смартфоне это выглядело по другому, вам следует использовать медиа запросы, в которых вы прописываете свои правила для того или иного разрешения.
Ответ написан
tseries
@tseries
Поддержку комментарий сверху. смотрите на разных разрешениях свой сайт. можно использовать встроенную функцию в браузере. для chrome жмем f12 и в верхнем левом углу жмем на значок телефона.
Ответ написан
Ваш ответ на вопрос

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

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