Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

вопрос по верстке


anboza

Recommended Posts

Только что, Ptenec сказал:

position absolute вам в помощь

вы же заметили, что картинка взаимодействует с текстовым блоком?

и как мне при абсолюте это сделать?

 

Надіслати
Поділитися на інших сайтах

37 минут назад, anboza сказал:

что картинка взаимодействует с текстовым блоком

 

Не совсем понятно по макету как взаимодействует текст с картинкой. Может Вам поможет минусовой margin-right

Надіслати
Поділитися на інших сайтах


Только что, i3bepb сказал:

 

Не совсем понятно по макету как взаимодействует текст с картинкой. Может Вам поможет минусовой margin-right

что не понятно по тексту в макете? он начинается от 0-й позиции контейнера и занимает 80% его, а изображение, занимает 20% контейнера, но выходит за его рамки, как если бы был container-fluid
минусовой маrgin - это ок, но мы же помним, что это резинка.

и трансформация пропорции, должна сохраниться до самых до 768 по ширине

Змінено користувачем anboza
Надіслати
Поділитися на інших сайтах

В 28.11.2019 в 15:01, anboza сказал:

подскажите

 

обычно верстку показывают на конкретном примере с HTML+CSS.

На пальцах как-то неудобно давать совет.

Вы же могли сделать тестовую страницу и дать на нее ссылку?

Так проще подсказать по коду, т.к. его можно на лету в браузере править и вам показывать.

Надіслати
Поділитися на інших сайтах

Спойлер

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Document</title>

	<style>
		.container {
			max-width: 768px;
			margin: 0 auto;
		}
		img {
			width: 500px;
		}
		.fake {
			width: 300px;
			float: right;
			height: 333px;
		}
	</style>

</head>
<body>
	
	<div class="container">
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae ea exercitationem nobis? Beatae, ad magni officia ipsum minus quidem consequatur libero commodi magnam reprehenderit rerum voluptatibus laborum, voluptas cumque sequi?
		Illum aperiam delectus ipsam maiores repudiandae dicta similique ea! Alias, soluta quas possimus molestias natus voluptates quaerat consequuntur, at expedita numquam excepturi vitae accusantium aliquid incidunt accusamus ullam voluptate reiciendis!
		Exercitationem ipsa, et eligendi vero officiis ducimus. Totam a voluptatem expedita! Impedit, neque eveniet pariatur atque dolorem incidunt sint dolor iusto optio, ab a enim fugiat perferendis rerum cumque. Enim.
		Asperiores tempore aliquam optio vel dolore ullam dicta voluptatem porro doloribus. Delectus nihil cumque, suscipit autem nostrum velit reiciendis harum illum est in culpa deserunt iusto at dicta quod exercitationem.
		<div class="fake"><img src="1.jpg"></div>
		Expedita voluptas architecto facilis! Recusandae soluta excepturi dignissimos consequatur adipisci blanditiis quod doloribus rerum praesentium voluptates, molestiae similique cum ipsum tempora atque explicabo architecto quisquam quidem odio doloremque impedit illum!
		Nobis, quia consequuntur nihil porro quidem, ratione aspernatur facilis quasi quisquam, fugiat facere tenetur exercitationem repellendus adipisci asperiores in. Quo ad tempore obcaecati numquam natus aliquid eius sapiente cupiditate nisi!
		Odio aspernatur molestias neque fuga libero quos eveniet. Expedita tempora aspernatur illo optio beatae vitae, fugiat impedit facere explicabo autem provident ipsa excepturi praesentium tenetur. Pariatur magni quae asperiores sequi!
		Asperiores nostrum delectus fugit deserunt temporibus sit similique, ad totam officiis odit quibusdam ab natus iusto id optio cum, exercitationem perferendis doloremque ut voluptatum nisi quasi, doloribus error illum. Repellat!
		Quas odit obcaecati sunt corporis ad dignissimos voluptatum? Quos sequi expedita cupiditate eligendi labore incidunt! Ex ut obcaecati dolorum id corrupti, odio asperiores atque velit, reprehenderit in necessitatibus? Aliquam, esse.
		Consequatur quam laborum labore. Dolore, ipsum quibusdam. Soluta iste provident rem omnis ea perferendis non, nisi error a, minima, tempora voluptatem quasi adipisci. Reiciendis fugiat molestiae alias perferendis nesciunt maxime?
	</div>

</body>
</html>

 

https://prnt.sc/q7jfz4

 

?

Змінено користувачем destreser
Надіслати
Поділитися на інших сайтах


  • 2 weeks later...
В 05.12.2019 в 03:19, sazonoff сказал:
В 28.11.2019 в 15:01, anboza сказал:

вопрос по верстке

обычно верстку показывают на конкретном примере с HTML+CSS.

На пальцах как-то неудобно давать совет.

Вы же могли сделать тестовую страницу и дать на нее ссылку?

Так проще подсказать по коду, т.к. его можно на лету в браузере править и вам показывать.

 

Ага. Вот вариант.

А вот пустой проект.

Надіслати
Поділитися на інших сайтах


Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку

×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.