Испытание: галерея путешествий. Оформление

У вас закомментирован весь HTML-код, который видно на скриншоте. Проверьте код выше закомментированного на наличие этих же ошибок.

В этом и дело — класс gallery есть у изображений, хотя быть его не должно. Вы исправили ошибку в закомментированном фрагменте кода, а здесь она осталась.

в закоментированном фрагменте кода тоже у изображений класс gallery. Саша, я пробовал по разному напишите пожалуйста где должен быть class galleryконкретно,а где его не должно быть? его уже и удалял и вставлял и оставлял, ничего не меняется

HTML-код:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Испытание: галерея путешествий. Оформление</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Галерея путешествий</h1>
<p>
Оправдание <q>У меня лапки</q> больше не работает.<br>
Путешествуйте вместе с <a href="https://cats-travel.com">нашим агентством</a>. Мяу.
</p>
<div class="gallery">
<img src="files/greece.jpg" width="140" height="200" alt="Греция">
<img class="new" src="files/japan.jpg" width="150" height="170" alt="Япония">
<img src="files/turkey.jpg" width="170" height="130" alt="Турция">
</div>
</body>
</html>


Доброго времени суток,возможно вопрос смешной,но я не понимаю как убрать эти “белые пропасти” между дивами и заголовками. Подскажите,а?)

Скорее всего у вас прописаны ещё какие-то стили, для класса info, например. Пришлите, пожалуйста, код решения текстом и целиком.

HTML:


CSS:
body {
width: 550px;
margin: 0;
padding: 0 10px;
font-family: “Arial”, sans-serif;
font-size: 16px;
line-height: 20px;
}

h1 {
font-size: 26px;
}

p {
width: 400px;
padding: 15px 20px;
color: white;
}

a {
color:orange;
}
.new {
border: 5px solid orange;
border-radius: 20px;
}

.gallery img {
margin-right: 10px;
vertical-align: top;
border-radius: 20px;
}

.info {
color:white;
background-color:#333333;
margin-right:51px;
padding:15px;
padding-left:18px;
}

Я с этим не первый раз сталкиваюсь,но только сейчас решил разобраться.

Ну что чайники. Если бы вы читали внимательно условия задания перед тем как к нему приступить вы легко бы разобрались. Я это сделал и получил 100% результат.

Сверху у тебя css правильный. Но вот с картинками ты намудрил. Из-за этого и пробелы образовались. Там и ищи причину.

Здравствуйте!
Я пытался подобрать значение для абзаца и получилось 490 пикселей - неправильно. В видеоразборе я узнал, что оно равно 460 пикселей. Почему? Я придерживался такой логике: ширина картинок + отступы справа от картинок + 2 границы 2-й картинки, более подробно: 140 + 10 + 5 + 150 + 5 + 10 + 170 = 490. Почему 460 не понимаю.

Решение!

Здравствуйте. Пожалуйста, объясните подробней. Почему селектор просто с именем .gallery не будет воздействовать на img внутри div’а? Ведь класс gallery должен воздействовать на все элементы внутри div’а. Прекрасно понимаю, что правильней указывать “.gallery img”, чтобы, если вдруг внутри div’а окажутся другие теги, воздействие было строго на картинки, но всё же почему, когда указываешь просто “.gallery” нифига не происходит?

Разобрался: свойства margin, border и vertical-align не наследуются потомками.