xzarxzes

http://jsfiddle.net/xzarxzes/sKvmF/

Не рекомендуется использовать html 5 shiv из репозиториев гугла http://zoompf.com/blog/2012/05/html5shiv-and-serving-content-from-code-repositories. Кодировку лучше указывать перед <title>

После валидации вашего документа, валидатор нашел 18 ошибок. Зачем указывать шрифты в пунктах ? .navigation ul { left: 0; text-align: center } - судя по всему не имеет никого смысла.

http://css-tricks.com/off-canvas-menu-with-css-target/.

Вот ответ на ваш вопрос http://stackoverflow.com/questions/4108983/input-type-image-shows-unwanted-border-in-chrome-and-broken-link-in-ie7, для type="image" надо указывать src, поставтье type="button" или type="submit", эта рамка вроде как указывает на отсутствующий src, как я понял. Или в атрибуте src указывайте адрес иконки, а background уберите.

http://jsfiddle.net/xzarxzes/QfqhA/

Попробуйте добавить вот это в head - <meta name="viewport" content="width=device-width, initial-scale=1">.

там вроде как clearfix пробовалось сделать) Это clearfix и есть, единственное только display: table актуален только для псевдоэлемента :before, для предотвращения вертикальных коллапсов http://nicolasgallagher.com/micro-clearfix-hack/ Класс хэдеру нужен, так как может добавиться еще один хэдер в дальнейшем (только лучше указать "main-header" или "site-header"). Здесь полно других классов которые совершенно не нужны и без которых можно было бы и обойтись.

Не стоит использовать элемент nav, для навигации в футере, nav нужен для главного меню в документе http://www.w3.org/TR/html5/sections.html#the-nav-element

У вас нет заголовка h1, также страница не проходит валидацию. Не рекомендуется использовать html5 shiv из репозитория который указан у вас http://zoompf.com/blog/2012/05/html5shiv-and-serving-content-from-code-repositories. Элемент img следует использовать для картинок которые несут смысловую нагрузку и относятся к контенту страницы, я это к тому что это плохая идея создавать для разделителя, и прочих фоновых картинок отдельный img элемент в html, для этого существует background-image. Для элемента input есть атрибут type="tel", так что пожалуй следует использовать его вместо type="text" который указан у вас для inputa'a с id - phone в хэдере и input'ы следует располагать внутри элементов form.

Не рекомендуется использовать html 5 shiv из google репозитория http://zoompf.com/blog/2012/05/html5shiv-and-serving-content-from-code-repositories

https://css-tricks.com/examples/ShapesOfCSS/

Не стоит подключать html5shiv из репозитория, который у вас указан. Вот здесь можно про это почитать http://zoompf.com/blog/2012/05/html5shiv-and-serving-content-from-code-repositories

http://html5doctor.com/the-article-element/ В любых примерах с элементом aticle используется footer и header, article может использоваться сколько угодно раз на странице, это может быть к примеру комментарий или новость, так же в примере с footer'ом на который я давал ссылку элемент footer находится внутри section, header у меня содержит заголовки h1 h2, что является heading'ом section, а в footer находится кнопка, хотя здесь я может быть и переборшил. Семантически я указываю на header и footer - section upd: "An important point to note is that you are not restricted to use one<footer> element per site, you can use multiple footers, each of which will then become the <footer> for that section of the document. You could therefore have a <footer> for a <section> or an <article>." http://www.anthonycalzadilla.com/2010/08/html5-section-aside-header-nav-footer-elements-not-as-obvious-as-they-sound/ http://www.whatwg.org/specs/web-apps/current-work/#the-footer-element

У меня картинки в base 64, я подумал что лучше сократить css. Лучше не сокращать CSS и картинки вынести в JPG или PNG. Это более удачный вариант в реальных проектах, так как в случае base64 картинка будет подгружаться даже в тех случаях, когда элемента с ней нет на странице. Сами понимаете, скорость загрузки заметно сократится. Ну если не будете делать по CSS файлу на каждую страницу. И вроде теги header и footer предназначены для того, чтобы отметить ими шапку и подвал страницы соответственно, а не верхнюю и нижнюю часть отдельного блока. Согласно html 5 doctor, header и footer можно использовать неограниченное число раз, в тех элементах который создают контекст section - такие как body, aside, section, article, nav, если конечно я все правильно понял: http://html5doctor.com/the-footer-element/, http://html5doctor.com/the-header-element/ . В данном случае у меня на странице есть основной header и footer, а остальные вложены в элемент section и представляют собой собственно footer и header которые относятся к определенной секции контента, как мне кажется ошибки здесь нет и моя разметка правильная, поправьте меня если я ошибаюсь. Что касается base 64 то это уменьшает количество http запросов, но я так понял это палка о двух концах, вот здесь пишут http://www.mobify.com/blog/data-uris-are-slow-on-mobile/, что на мобильных устройствах это сказывается на производительности. Я всегда стараюсь как то оптимизировать изображения и обычно компаную их в один большой спрайт, но в данном случае мне хотелось сделать background-image растягивающимся, а со спрайтами это делать сложнее, по крайней мере мне не удалось найти годного решения и я решил использовать data-uri.

У меня картинки в base 64, я подумал что лучше сократить css.

верстка: http://themfast.herokuapp.com/ макет: http://themfast.herokuapp.com/ThemFast.png

http://jsfiddle.net/xzarxzes/z6zz6/

отросток прицепил, дальше не знаю как, если добавить текст все ломается. http://jsfiddle.net/xzarxzes/K5RPS/

Цвет текста в сером блоке — черный, а в черном блоке — белый, а у вас везде белый. Верно, не обратил внимание что там разные цвета.

Вот мое решение второго задания, если интересно http://jsfiddle.net/xzarxzes/Lpb27/

А как фон закруглил ?

Вот что то похожее, только если растягивать то там будут косяки с фоном, и фон не придумал как закруглить. http://jsfiddle.net/xzarxzes/yp3TB/1/. Там у псевдо - элемента background: transparent еще лишнее, забыл убрать.

Вот здесь сказано что шрифт для постера к этому фильму "ff din", написанный капсом. http://fontsinuse.com/uses/5705/the-wolf-of-wall-street-movie-posters. Наверно это он и есть, на картинке, хотя там "R" какая то другая. А вот здесь ты можешь его купить за 10 200руб, там даже есть кириллица. http://www.paratype.ru/pstore/fonts/FF-DIN-Round-Pro.htm

Можно и не закрывать, но это вроде как хороший тон и хорошо для старых браузеров. Я до этого писал без слэша одиночные тэги, но решил что на всяких случай лучше закрывать, мало ли. http://stackoverflow.com/questions/1946426/html-5-is-it-br-br-or-br А по поводу "трэша" это удобный способ задавать стили для определенной версии ie используя класс, нежели писать отдельную таблицу и подключать ее в хэде, что дает в свою очередь лишний http запрос. http://www.paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/