PavelTkachev

Пытаюсь сверстать адаптивную вёрстку сайта с двумя колонками. Я сделал два блока с атрибутами inline-block внутри общего контейнера. Задал левому ширину 80%, а правому 20%. И задал min-weight и max-weight. Но теперь моя задача усложнилась. Мне надо, чтобы правая колонка всегда была 200px, а левая заполняла всё оставшееся место. Можно так сверстать с помощью float и margin-right. Но мне нужно, чтобы правая колонка проваливалась вниз при достижении min-width для левой колонки. Как это можно сделать?

Потому что библиотека уже будет загружена в кеш браузера.

В моём случае это просто угода протекционизму. Хочу минимум килобайт, потому даже чистый JavaScript не хочу. А так, конечно, с CDN качать Jquery. У большинства посетителей оно тогда вообще закачиваться не будет. Могут ли подобные директивы быть внутри CSS файла? Как раз таки элементарное и вызывает массу вопросов, так как можешь его целиком удержать в голове. А сложное вопросов обычно не вызывает, так как в голову не помещается.

Спасибо, начал изучать. А можно ли сделать так, чтобы для тех браузеров у которых это работает блок был скрыт, а для остальных открыт? Но без использования JavaScript. Не буду пользоваться западными технологиями. Не лучше, так как ради элементарной задачи я буду таскать с сайтом лишние килобайты. Я даже простой JavaScript писать не хочу. Спасибо. Начал изучать. Да, но там слишком много всего. Оставил на потом.

Я читал упоминания о том, что на CSS3 можно без JavaScript добиться открытия и закрытия блоков сайта. Я хочу разместить в скрытом блоке форму обратной связи и сделать кнопку, по нажатию на которой эта форма будет появляться, а кнопка исчезать. Можно ли это сделать с помощью CSS3? И если да, то как?

Скажите, а элемент <time> должен быть тольчо внутри <article>, или же он показывает время для контента внутри своего родителя?

Проще. Но DOM элементов больше и для скриптов сложнее пробегать дерево. А CSS кешируется и ничего, что больше строк.

Переучиваться-то надо. На дворе уже который год HTML5, а я только пол года, как стал его применять. В общем <header></header> <nav></nav> <main> <article> <h1></h1> <time></time> </article> <aside></aside> <menu></menu> </main> <footer></footer> Лучший и не противоречивый вариант?

Не знаешь что использовать - используй div <div> не имеет эстетического привкуса семантики.

Эту цитату вообще непонятно откуда взяли, если честно. в спеке такого нету http://www.w3.org/TR/2012/WD-html-main-element-20121217/ точнее нечто подобное есть, но это относится к хедерам, футерам и прочему что относится к сайту вцелом, а не к документу конкретно Спасибо за ссылку. Примеры, правда, там все одноколоночные. И вроде как <header></header> <nav></nav> <main> <article> <h1></h1> <time></time> </article> <aside></aside> <menu></menu> </main> <footer></footer> Не противоречит тому, что я там прочитал.

Просто если там и навигации не должно быть, что тогда я не понимаю чем он от <article> отличается? <header></header> <nav></nav> <section> <main> <h1></h1> <time></time> </main> <aside></aside> <menu></menu> </section> <footer></footer>

Вот и я не понимаю, потому и спрашиваю. Он же есть, значит для чего-то нужен. Я вначале думал, что <main> - это как раз для центра сайта. А узнав о требованиях уникальности перестал понимать что использовать для центра сайта и зачем <main>. Подскажите, пожалуйста. Напомню простую двухколоночную вёрстку описанной мною выше. <header></header> <nav></nav> <section> <main> <h1></h1> <article> <time></time> <menu></menu> </article> </main> <aside></aside> </section> <footer></footer> Что вместо <section>? Должен ли быть <h1> внутри <article>?

Не для них. А как насчёт <main>? Внутри него должно быть уникальное содержимое. main внутри section мне кажется вообще бредок aside это не обязательно сайдбар. Точнее это вообще скорее всего не сайдбар (если уж кому-то хочется в корень упороться сематикой-шмемантикой) Я бы писал как-то так: <header></header><nav> <a href="page-1.html"></a> <a href="page-2.html"></a> <a href="page-3.html"></a></nav><main> <h1></h1> <p></p> <p></p> <p></p> <h2></h2> <p></p> <p></p> <p></p></main><div class="side"> <nav> <a href="sub/page-1.html"></a> <a href="sub/page-2.html"></a> <a href="sub/page-3.html"></a> </nav></div><footer>copy</footer>Если же в сайдбаре находится информация привязанная к контенту, сноска или навигация по конкретному документу, то тогда это скорее всего aside <header></header><nav> <a href="page-1.html"></a> <a href="page-2.html"></a> <a href="page-3.html"></a></nav><main> <div> <h1 id="root-header"></h1> <p></p> <p></p> <p></p> <h2 id="sub-header"></h2> <p></p> <p></p> <p></p> </div> <aside> <nav> <a href="#root-header"></a> <a href="#sub-header"></a> </nav> </aside></main><footer>copy</footer>А если по правде, то я не сильно заморачиваюсь семантикой-шмемантикой в принципе. Если мне нужен сайдбар, я применяю aside. Основную часть документа обхватываю в main. Статьи/комменты/посты отделяю в article. Целые разделы/главы если такие существуют в документе в принципе выделяю в section Если статья имеет явно выраженную шапку и подвал, то как-то так это может выглядеть <article> <header> <h1></h1> </header> <p></p> <p></p> <p></p> <footer> Autor Name | Public Date </footer></article>А если еще серьезнее подходить к проблеме, то скажем так... нынче контент лепят ну через такой "коаксиальный проход" что его вообще проблематично как-то внятно идентифицировать. Так что в определенный момент просто забиваешь на это все и просто пишешь так как тебе удобно. вот и все. Вопсрос не о том, как сейчас пишут. А о том, как писать в соответствии с назначениями тегов. Цитирую описание с этого сайта: Элемент <main> предназначен для основного содержимого документа. Содержимое должно быть уникальным и не включать типовые блоки вроде шапки сайта, подвала, навигации, боковой панели, формы поиска и т. п. Поэтому <aside> в <main> никак не помещается. Вот у получилось у меня, что основная колонка в двухколоночной вёрстке - это <main>, а боковая панель - <aside>. Но надо же это всё поместить в какой-то общий контейнер. Согласен, что <section> - это плохой вариант. Для шапки есть <header>, для подвала - <footer>. А для центра что?

Внутри тега <main> должен находится уникальный контент. На два раздела уже разделено двумя <article>. Добавдение <section> что-то даёт?

Но не будет уникальности в <main>, так как <aside> содержит одинаковые для всех страниц данные. А зачем <section>?

То есть правильно для двухколоночной вёрстки <header></header> <nav></nav> <section> <main> <h1></h1> <article> <time></time> <menu></menu> </article> </main> <aside></aside> </section> <footer></footer> Где <menu></menu> - это навигация по документу. Правильно, что <h1> не внутри <article>?

Хочу применять в сёрстке тег <main> и не могу понять как его применять правильно. Из описания я понял, что это тег для основного и уникального контента для данной страницы. Но как тогда его использовать с тегом <article>, ведь в нём данные контент должен также находиться? Что-то на подобии: <main> <article> <h1></h1> <time></time> </article> </main> Так? И должен ли тег <h1> быть внутри <article>?

А зачем роли, если их не учитывают поисковики?

Я пока не нашёл лучше, чем вот тут

Подскажите, что ещё существует для семантически на сайте, кроме <main role="main">. То есть кроме html5-тегов и ролей.

Спасибо!

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

Можно ли сделать для фомы вида <input placeholder="текст"> свой цвет шрифта и курсив для надписи "текст", отличный от цвета шрифта и нормального начертание, которые будут для вводимого в поле текста?

А зачем тогда нужны семантические теги? Да и вообще введение кучи новых тегов в HTML5? div и span достаточно для вёрстки всего сайта.

Это я понимаю. <main><time><h1> работает так же, как <article><time><h1>? От использования <main> есть какая-то практическая польза?