Здравствуйте! Подскажите пожалуйста, что не так в коде? При проверке не видит 8 блок, хотя в браузере все отображается. Перерыла весь форум, у многих такая проблема была, но причины разные. Я все дивы и закрывающие теги проверила.Может уже взгляд замылился.
Кваст
Новинки
Вахтёр
Ржаной хлеб, Вода, Солод, Соль
Терпкий и мощный, вкус этого кваса взбодрит после тяжёлого дня и придаст сил для вечерних приключений!
Подробнее
Купить
150 Р.
Романтик
Ячменный хлеб, Вода, Солод, Апельсин
Лёгкий и освежающий напиток поможет сохранять отличное настроение в течение всего дня.
Подробнее
Купить
90 Р.
<li class="feacher-item">
<h2>Своё, родное</h2>
<p>Не заработка ради, а импортозамещения для. Поднимаем производство.</p>
</li>
<li class="feacher-item">
<h2>Не экономим</h2>
<p>Человек это то, что он ест и пьет. У нас только качественные ингредиенты.</p>
</li>
</ul>
</div>
<div class="kvas-history">
<h2>Немного истории</h2>
<dl>
<dt><h3>Происхождение кваса</h3>
<i>Источник: <a href="https://ru.wikipedia.org" target="_blank">ru.wikipedia.org</a></i></dt>
<dd>
<img src="img/wiki-1.png" alt="Происхождение кваса" width="200" height="101">
<p>Квас на Руси появился в X-XI веке. Само слово «квас» тоже имеет древнерусское происхождение. Помимо России квас готовят в Белоруссии, Сербии, Македонии, Словакии и многих других странах, но называется он везде одинаково — квас.</p>
</dd>
<dt><h3>Классификация кваса</h3>
<i>Источник: <a href="https://ru.wikipedia.org" target="_blank">ru.wikipedia.org</a></i></dt>
<dd>
<img src="img/wiki-2.png" alt="Классификация кваса" width="200" height="101">
<p>По российскому ГОСТу для промышленного изготовления — это напиток с объёмной долей этилового спирта не более 1,2%, изготовленный в результате незавершённого спиртового и молочнокислого брожения сусла.</p>
</dd>
</dl>
</div>
<div class="reviews">
<h2>Пресса о нас</h2>
<div class="reviews-list">
<blockquote class="review-item">
<p>Сегодня мы провели дегустацию чего-то действительно новенького — крафтового кваса. Да, да, вы не ослышались! Спасибо Арсену и Руслану за то, что предоставили целую бочку своего напитка!</p>
<cite>Газета столичный Стольник</cite> <a class="btn" href="#">Читать далее</a></blockquote>
</div>
</div>
<div class="price-list">
<h2>Ассортимент</h2>
<table class="price-list">
<tr>
<th>Название</th>
<th>Алк.</th>
<th>Ккал</th>
<th>Объём</th>
<th>Стоимость</th>
</tr>
<tr>
<td>Классика</td>
<td>< 1,2%</td>
<td>33</td>
<td>330 мл</td>
<td>120 Р.</td>
</tr>
<tr>
<td>Шабаш</td>
<td>> 1,2%</td>
<td>45</td>
<td>330 мл</td>
<td>250 Р.</td>
</tr>
<tr>
<td>Вахтёр <sup>Новинка</sup></td>
<td>< 1%</td>
<td>35</td>
<td>0,5 л</td>
<td>150 Р.</td>
</tr>
<tr>
<td>Романтик <sup>Новинка</sup></td>
<td>< 0,5%</td>
<td>27</td>
<td>0,5 л</td>
<td>90 Р.</td>
</tr>
</table>
</div>
<div class="feedback">
<h2>Заказать</h2>
<p class="feedback-tip"> Не ждите пока нас отрекламируют, как Вятский квас, и мы поднимем цены! Закажите настоящий крафтовый квас сейчас. При заказе от 10 баррелей — скидка 10%.</p>
<form class="feedback-form" action="/keksby-mail" method="post">
<div class="feedback-form-group">
<lable for="fullname">Представьтесь:</lable>
<input type="text" name="fullname" id="fullname"><br></div>
<div class="feedback-form-group">
<lable for="phone">Номер телефона:</lable>
<input type="text" name="phone" id="phone"></div>
<div class="feedback-form-group">
<lable for="dop-phone">Доп. номер:</lable>
<input type="text" name="dop-phone" id="dop-phone"></div>
<div class="feedback-form-group">
<lable for="e-mail">Email:</lable>
<input type="text" name="e-mail" id="e-mail"></div>
<div class="feedback-form-group">
<lable for="zakaz">Объем заказа:</lable>
<select name="zakaz" id="zakaz">
<option value="zakaz">От 5 до 10 баррелей в неделю</option>
</select></div>
<div class="feedback-form-group">
<label for="message">Доп. комментарий:</label>
<textarea type="text" name="message" rows="10" cols="110" id="message">
</textarea>
</div>
<div class="checkbox-area">
<label>
<input type="checkbox" name="subscription"> Я согласен получать квасную рассылку</label>
</div>
<input type="submit" class="btn" value="Отправить заказ">
</form>
</div>
<br>
<div class="footer-page">
<img src="img/logo.png" alt="Кваст" width="140" height="76">
<ul lass="footer-nav">
<li><a class="btn" href="#">История</a></li>
<li><a class="btn" href="#">Производство</a></li>
<li><a class="btn" href="#">Ассортимент</a></li>
<li><a class="btn" href="#">Где купить</a></li>
</ul>
<div class="footer-social">
<a class="social-btn" href="https://instagram.com">Инстаграм</a>
<a class="social-btn" href="https://facebook.com">Фейсбук</a>
<a class="social-btn" href="https://vk.com">Вконтакте</a>
</div>
<p>При перепечатке материалов ссылка на сайт обязательна!</p>
<div class="footer-copyright">
<img src="img/htmlacademy.png" alt="htmlacademy.ru" width="27" height="34">
<span class="heart">Разработчик:</span> <a href="https://htmlacademy.ru">HTML Academy</a></div>
</div>
Как-то странно здесь у меня вставился код, почему-то не весь. Подскажите, как правильно его здесь разместить.
Спасибо! Сейчас попробую правильно))
<!DOCTYPE HTML>
<html>
<head lang="ru">
<meta charset="utf-8">
<title>Кваст</title>
</head>
<body>
<div class="page-header">
<div class="header-top">
<div class="header-logo">
<img src="img/logo.png" alt="Кваст" width="140" height="76">
</div>
<ul class="main-nav">
<li><a href="#">История</a></li>
<li><a href="#">Производство</a></li>
<li><a href="#">Ассортимент</a></li>
<li><a href="#">Где купить</a></li>
</ul>
</div>
<div class="promo"> <a href="#">Крафтовый квас <br>всему голова!</a></div>
</div>
<div class="new-prodact">
<h2>Новинки</h2>
<div class="new-items">
<div class="catalog-item">
<h3>Вахтёр</h3>
<table>
<tr>
<td>Алк.</td>
<td>< 1%</td>
</tr>
<tr>
<td>Ккал:</td>
<td>35</td>
</tr>
</table>
<p>Ржаной хлеб, Вода, Солод, Соль</p>
<img src="img/bottle-left.jpg" width="319" height="459">
<p>Терпкий и мощный, вкус этого кваса взбодрит после тяжёлого дня и придаст сил для вечерних приключений!</p>
<a class="btn" href="#">Подробнее</a>
<a class="btn" href="#">Купить</a>
<b>150 Р.</b></div>
<div class="catalog-item">
<h3>Романтик</h3>
<table>
<tr>
<td>Алк.</td>
<td>< 0,5%</td>
</tr>
<tr>
<td>Ккал:</td>
<td>27</td>
</tr>
</table>
<p>Ячменный хлеб, Вода, Солод, Апельсин</p>
<img src="img/bottle-right.jpg" width="319" height="459"><br>
<p>Лёгкий и освежающий напиток поможет сохранять отличное настроение в течение всего дня.</p>
<a class="btn" href="#">Подробнее</a>
<a class="btn" href="#">Купить</a>
<b>90 Р.</b></div>
</div>
</div>
<div class="features">
<ul>
<li class="feacher-item">
<h2>Варим сами</h2>
<p>Вот этими самыми руками. Экспериментируем и творим, что хотим.</p>
</li>
<li class="feacher-item">
<h2>Своё, родное</h2>
<p>Не заработка ради, а импортозамещения для. Поднимаем производство.</p>
</li>
<li class="feacher-item">
<h2>Не экономим</h2>
<p>Человек это то, что он ест и пьет. У нас только качественные ингредиенты.</p>
</li>
</ul>
</div>
<div class="kvas-history">
<h2>Немного истории</h2>
<dl>
<dt><h3>Происхождение кваса</h3>
<i>Источник: <a href="https://ru.wikipedia.org" target="_blank">ru.wikipedia.org</a></i></dt>
<dd>
<img src="img/wiki-1.png" alt="Происхождение кваса" width="200" height="101">
<p>Квас на Руси появился в X-XI веке. Само слово «квас» тоже имеет древнерусское происхождение. Помимо России квас готовят в Белоруссии, Сербии, Македонии, Словакии и многих других странах, но называется он везде одинаково — квас.</p>
</dd>
<dt><h3>Классификация кваса</h3>
<i>Источник: <a href="https://ru.wikipedia.org" target="_blank">ru.wikipedia.org</a></i></dt>
<dd>
<img src="img/wiki-2.png" alt="Классификация кваса" width="200" height="101">
<p>По российскому ГОСТу для промышленного изготовления — это напиток с объёмной долей этилового спирта не более 1,2%, изготовленный в результате незавершённого спиртового и молочнокислого брожения сусла.</p>
</dd>
</dl>
</div>
<div class="reviews">
<h2>Пресса о нас</h2>
<div class="reviews-list">
<blockquote class="review-item">
<p>Сегодня мы провели дегустацию чего-то действительно новенького — крафтового кваса. Да, да, вы не ослышались! Спасибо Арсену и Руслану за то, что предоставили целую бочку своего напитка!</p>
<cite>Газета столичный Стольник</cite> <a class="btn" href="#">Читать далее</a></blockquote>
</div>
</div>
<div class="price-list">
<h2>Ассортимент</h2>
<table class="price-list">
<tr>
<th>Название</th>
<th>Алк.</th>
<th>Ккал</th>
<th>Объём</th>
<th>Стоимость</th>
</tr>
<tr>
<td>Классика</td>
<td>< 1,2%</td>
<td>33</td>
<td>330 мл</td>
<td>120 Р.</td>
</tr>
<tr>
<td>Шабаш</td>
<td>> 1,2%</td>
<td>45</td>
<td>330 мл</td>
<td>250 Р.</td>
</tr>
<tr>
<td>Вахтёр <sup>Новинка</sup></td>
<td>< 1%</td>
<td>35</td>
<td>0,5 л</td>
<td>150 Р.</td>
</tr>
<tr>
<td>Романтик <sup>Новинка</sup></td>
<td>< 0,5%</td>
<td>27</td>
<td>0,5 л</td>
<td>90 Р.</td>
</tr>
</table>
</div>
<div class="feedback">
<h2>Заказать</h2>
<p class="feedback-tip"> Не ждите пока нас отрекламируют, как Вятский квас, и мы поднимем цены! Закажите настоящий крафтовый квас сейчас. При заказе от 10 баррелей — скидка 10%.</p>
<form class="feedback-form" action="/keksby-mail" method="post">
<div class="feedback-form-group">
<lable for="fullname">Представьтесь:</lable>
<input type="text" name="fullname" id="fullname"><br></div>
<div class="feedback-form-group">
<lable for="phone">Номер телефона:</lable>
<input type="text" name="phone" id="phone"></div>
<div class="feedback-form-group">
<lable for="dop-phone">Доп. номер:</lable>
<input type="text" name="dop-phone" id="dop-phone"></div>
<div class="feedback-form-group">
<lable for="e-mail">Email:</lable>
<input type="text" name="e-mail" id="e-mail"></div>
<div class="feedback-form-group">
<lable for="zakaz">Объем заказа:</lable>
<select name="zakaz" id="zakaz">
<option value="zakaz">От 5 до 10 баррелей в неделю</option>
</select></div>
<div class="feedback-form-group">
<label for="message">Доп. комментарий:</label>
<textarea type="text" name="message" rows="10" cols="110" id="message">
</textarea>
</div>
<div class="checkbox-area">
<label>
<input type="checkbox" name="subscription"> Я согласен получать квасную рассылку</label>
</div>
<input type="submit" class="btn" value="Отправить заказ">
</form>
</div>
<br>
<div class="footer-page">
<img src="img/logo.png" alt="Кваст" width="140" height="76">
<ul lass="footer-nav">
<li><a class="btn" href="#">История</a></li>
<li><a class="btn" href="#">Производство</a></li>
<li><a class="btn" href="#">Ассортимент</a></li>
<li><a class="btn" href="#">Где купить</a></li>
</ul>
<div class="footer-social">
<a class="social-btn" href="https://instagram.com">Инстаграм</a>
<a class="social-btn" href="https://facebook.com">Фейсбук</a>
<a class="social-btn" href="https://vk.com">Вконтакте</a>
</div>
<p>При перепечатке материалов ссылка на сайт обязательна!</p>
<div class="footer-copyright">
<img src="img/htmlacademy.png" alt="htmlacademy.ru" width="27" height="34">
<span class="heart">Разработчик:</span> <a href="https://htmlacademy.ru">HTML Academy</a></div>
</div>
</body>
</html>
Перед 8 блоком уберите <br>
Спасибо большое! как все просто оказалось, а еще смотрела на этот br, как раз думала убрать. Только теперь вопрос возник, почему этот перенос нельзя было ставить? И подскажите пожалуйста, в целом код нормальный или кривоват?
Ума не приложу. Ошибкой это не назовёшь – так уж у них проверка организована…
Только что поставил перенос после 1 блока – все остальные пропали…
Код? Внимательно не смотрел – нужно время.
Если интересно – отвечу позже…
Еще раз спасибо! Конечно интересно! Я только начинающий верстальщик, многие тонкости еще придется учить. Вы супер!
Кто? Я???
Такой же ученик, как и Вы.
Просто некоторые упражнения и испытания уже примелькались.
Ясненько)) но не каждый ученик ответит в два часа ночи)
Мелкие погрешности и опечатки Вы сможете найти сами…
Вставьте код по адресу: https://validator.w3.org/nu/#textarea
<div class="price-list">
<h2>Ассортимент</h2>
<table class="price-list">
А вот такое для валидатора не ошибка.
Названия классов должно быть разным.
<div class="kvas-history">
<h2>Немного истории</h2>
<dl>
<dt>
<h3>Происхождение кваса</h3><!-- этого здесь быть не должно -->
Вот подозрительный фрагмент.
В “Кексби” нас научили неправильной разметке.
Согласно спецификации заголовки вкладывать в списки определений нельзя.
https://www.w3.org/TR/html/grouping-content.html#the-dt-element
http://spec.piraruco.com/html5/grouping-content.htm#the-dt-element
Как сделать правильно – пока не знаю, но временно <h3>
заменил на <span>
(проверку, естественно 4 блок не пройдёт…)
В остальном код нормальный, – как у всех.
Спасибо за проверку! Буду дальше грызть верстку.