Согласно спецификации HTML5, header не является разделообразующим элементом. Поэтому не требует заголовков.
Ваше предупреждение относится к элементам article, которые являются разделообразующими, как и элементы section . Как туда добавить текст, не добавляя текст, – этого я подсказать не могу. В любом случае, предупреждение не является ошибкой.
Спасибо, а вот между <article> есть тег <h4>. Что же не нравится валидатору?
Во-первых, не блок, а вёрстку страницы.
Спасибо за помощь, не увидела, что все подобные блоки завернуты еще в один header.
Помогите, пожалуйста, еще с этим предупреждением:
Warning: Article lacks heading. Consider using h2-h6 elements to add identifying headings to all articles.
Понятно, что нужно использовать теги h2-h6, есть тег h4 в <section>
А в <header> только изображение. Как правильно добавить h4, не добавляя текст?
<div class="item col-lg-3 col-md-3 col-xs-12" data-filter-by="38"><article class="over-image show-always post-800 video type-video status-publish has-post-thumbnail hentry tag-custom-post tag-themes tag-touchsize tag-video-post tag-wordpress videos_categories-shows has-lazy-placeholder" itemscope><header><div class="image-holder"><img class="lazy" src="assets/images/42/2016/11/placeholder-450x350.jpg" data-original="https://demo3.touchsize.com/diginex/wp-content/uploads/sites/42/2016/10/DSC233245-450x350.jpg" width="450" height="350" alt="Showing it out again" /><div class="stripes"></div> <a href="video/showing-it-out-again/index.html" class="post-link"></a><a href="video/showing-it-out-again/index.html" class="post-format-icon"><span class="icon-video"></span></a><ul class="entry-categories"><li class="term-38"> <a href="video-category/shows/index.html">Shows</a> </li></ul> </div></header><section><a href="video/showing-it-out-again/index.html"><h4 class="entry-title" itemprop="name headline">Showing it out again</h4></a><ul class="entry-meta"><li class="entry-meta-author"><a href="author/admin/index.html" itemprop="author" itemscope><img alt='' src='https://secure.gravatar.com/avatar/07a586c70971fe7d764893201afa4af4?s=74&amp;d=mm&r=g' srcset='https://secure.gravatar.com/avatar/07a586c70971fe7d764893201afa4af4?s=148&#038;d=mm&r=g 2x' class='avatar avatar-74 photo' height='74' width='74' loading='lazy'/><span class="author-name" itemprop="name">Stefan Ciorici</span></a></li><li class="entry-meta-date"><i class="icon-time"></i><time datetime="2016-10-19T07:53:11+00:00">October 19, 2016</time></li><li class="entry-meta-views"><i class="icon-views"></i>816 views</li></ul></section></article></div>
Переделайте стили | забейте на валидатор | а доктайп какой?
И не надо пользоваться странными тегами.
<!DOCTYPE html> <html lang="en"> <head>
Это готовая тема Wordpress с themeforest. Вот демо темы https://demo3.touchsize.com/diginex/ Такая же ошибка валидации есть:
Error: The element header must not appear as a descendant of the header element.
Подскажите, пожалуйста, как правильно переделать этот блок.
это же валидный html5 вроде?
Вот здесь проверяю, загружаю файл https://validator.w3.org/#validate_by_upload
Протестировали в Яндекс, gmail и mail.ru, всё в порядке.
Спасибо за ответы! Тем не менее получилось для почты решить:
<div style="background:#ffffff;margin:0 auto 0 auto;max-width:600px"> <table align="center" bgcolor="#FFFFFF" border="0" cellpadding="0" cellspacing="0" style="border-collapse:collapse;max-width:600px;width:100%"> <tbody> <tr> <td align="center" style="line-height:0;padding:0px" valign="top"> <div style="background-color:#ffa5bf;width:600px;height:600px;background-image: url('https://love.romanticcollection.ru/wp-content/uploads/24177961-845c9047.jpg');background-size:500px auto;background-repeat:no-repeat;background-position: center center;"> <div style="background-image: url('https://love.romanticcollection.ru/wp-content/uploads/love-frame.png'); width: 100%; height: 100%"> </div> </div> </td> </tr> </tbody> </table> </div>
Появилась проблема. Это шаблон письма, который нужно отправить с сайта. Помогите, пожалуйста, какими стилями можно обойти то, что удаляет почтовый сервер.
<img style="display:block;position:absolute;left:0;top:0;width:600px;height:600px;z-index:1;"
<img style="display:block;width:600px;height:600px;"
<img style="display:block;position:absolute;left:123px;top:129px;width:382px;height:382px;object-fit:cover;overflow:hidden;z-index:0;"
<img style="display:block;height:382px;overflow:hidden;width:382px"
В вашем случае, тут три слоя.
Вы мой герой! Спасибо огромное, то, что надо!
