Не могу поднять картинку?

Question

[Idwln]

Не могу поднять картинку, вот код и скрин

CSS

.block {
	display: inline-block;
	min-width: 1440px;
	background: url("../img/Bg.jpg") 0 0  no-repeat;
	padding-left: 165px;
}

.content {
	display: inline-block;
}

.title {
	display: inline-block;
	max-width: 365px;
	padding-top: 156px;
	font-style: normal;
	font-weight: 700;
	font-size: 42px;
	line-height: 1.48;
	letter-spacing: 0.8px;
	color: #FFFFFF;
}

.text {}

.button {}

.image{
	display: inline-block;
	margin-top: -55px;
	padding: 0px 264px 0px 698px ;
	
}

HTML

<main>
		<div class="block">
			<div class="content">
				<div class="title">Get experience from the expert</div>
				<div class="text">Quid ex eo ortum, tam inportuno tamque crudeli; sin, ut aliquid ex</div>
				<div class="button">Contact Us</div>
				<div class="image"><img src="img/01.png" alt="woman"></div>
			</div>
		</div>
	</main>

Comments

[Ankhena]

На block поменяйте.

[Idwln]

Ankhena, Что только на block не менял. Не помогает

[Ankhena]

Idwln, сложно сказать, что вы делаете не так.
https://codepen.io/AnnaSummer/pen/PoExaEO

[Idwln]

Ankhena, Проверил ваш код, и работает он не при маленьких значениях высоты и ширины

[Ankhena]

Idwln,

работает он не при маленьких значениях высоты и ширины

Простите, что? Этому коду вообще без разницы какого размера будет картинка, он двигает родителя.
Сделайте песочницу, в которой видно вашу проблему.

[Idwln]

Ankhena, Знал бы я как это делается) Извините я совсем новичок, и многого не понимаю ещё

[Idwln]

Ankhena, Но теперь могу margin с отрицательными значениями выровнять вверх. Но это не то, что я хотел

[Ankhena]

Idwln, ну вот так же как я. Нужно зарегистрироваться на codepen.io, вставить туда код, сохранить, дать тут ссылку.

[Idwln]

Ankhena, https://codepen.io/idwln/pen/WNdYyqL

[Ankhena]

Idwln,

Но теперь могу margin с отрицательными значениями выровнять вверх. Но это не то, что я хотел

Вот ведь...
Вы двигали её зачем-то margin'ом, у вас не работало.
Я вам сказала как починить.
Теперь вам не нравится, что margin работает.

Думаю, что вам пришла пора начать изучение гридов. А по дороге флексов и позиционирования.
Инлайн-блоками перестали верстать уж скоро лет 10.

По дороге нужно определиться, будет ли эта тетка заменена на реальную фотографию. Если нет, то это не img в обертке, а псевдоэлемент. И позиционировать нужно его.

[Ankhena]

Idwln, вы можете заменить свои картинки на любые подходящие из яндекс.картинок или воспользоваться сервисом заглушек, например, https://picsum.photos/

Сейчас в вашей песочнице ничего не видно, кроме Contact Us и альта от картинки.

[Ankhena]

Idwln, ну и макет не забудьте прикрепить, чтобы хоть как-то знать где она должна быть.

[Idwln]

Ankhena,

[Idwln]

Ankhena, учусь я постепенно и прорабатываю домашку на основе тех знаний, которые имею) До флекса ещё пара уроков, поэтому скоро и с ним подружусь. А пока делаю, что могу

[Ankhena]

Idwln,

До флекса ещё пара уроков, поэтому скоро и с ним подружусь.

Прибейте абсолютом.
Или просто поставьте фоном.

[Юрий Иванов]

Ankhena, Скажите пожалуйста, может вы какой-нибудь блог ведете по верстке, или на ютуб снимаете видео. Всегда так интересно отвечаете на вопросы про верстку.

[Ankhena]

Юрий Иванов, лекции в аудитории могу, консультации могу. Записывать себя на видео не вдохновляет. Статьи пишу очень редко.

[Idwln]

Ankhena, Я как понял, если допустим я кнопке добавлю текста и задний фон растянется, то абсолют не поможет? Картинка станет уже не ровной?

[Ankhena]

Юрий Иванов, почему не поможет? Тётька будет прибита к нижнему краю блока и опустится вместе с ним.