Jump to content

zenw

User
  • Posts

    63
  • Joined

  • Last visited

  • Days Won

    2

Everything posted by zenw

  1. Не связано, поскольку элементы с position: absolute автоматически становятся блочными.
  2. 1. html, body { height:100%;}body { background: red; // ну или как хотите}2. @media (max-width: ширина_фоновой_картинки) { ._wrapper { background-size: auto; background-position: center top; }}
  3. Попробуйте заменить файлы шрифтов по этому пути теми, что скачаете с fontawesome.io, может быть, поможет.
  4. У меня в режиме эмуляции и на IE10 не работает( Однако вот отсюда код помогает: http://alex.leonard.ie/2013/01/27/ie-bug-text-ignores-z-index-of-higher-elements/ background: transparent url('http://alex.leonard.ie/misc-images/transparent.png') repeat 0 0;Естессно, картинку заменить на свою, и все такое.
  5. zenw

    Подменю

    http://jsfiddle.net/2szrdq53/ Опередили меня) Суть решения та же.
  6. Еще капелька оффтопа. Согласен с hypnocolor, поскольку этот человек мне вчера писал в скайп и предлагал сверстать это за те же 300 рублей. Вряд ли человек опечатался дважды.
  7. А если рендерить текст через Cufon или typeface.js? Судя по примеру на сайте, font-stretch поддерживается кроссплатформенно (но в эмулированном IE10 вместо текста какая-то мешанина, хотя все остальные версии работают).
  8. Мобильные браузеры чаще всего игнорируют правила для handheld, чтоб отображать странички как можно лучше. Мне кажется, можно попробовать ориентироваться на ширину экрана, например. @media max-width: 400px { .share { display: none; }}Надеюсь, что есть более элегантные способы.
  9. .item-cart-clear { // ...}text-indent должно применяться к блочному элементу, а не строчному.
  10. Это следствие минимизации, а не пример для подражания)
  11. Блоки кода хотя бы моноширинным шрифтом сделайте, иначе некрасиво и нечитаемо.
  12. Раз он нужен только для обрезки (по сути, ограничения ширины сайта, чтоб она не превышала ширины body), то пусть и называется, имхо, например, site-width-limiter. Не менее семантично, чем wrapper или container.
  13. Не обязательно инпуты и другие блоки оборачивать в label. Лучше замените label на div, а label привяжите к инпутам через for="input-id". То есть: <label class="what"> <span>Что</span> <div id="middle-search-app"> <input id="search-what-field" name="term" autocomplete="off" data-bind="value: term, valueUpdate: 'afterkeydown', attr:{placeholder: placeholder}" value="" placeholder="Куда пойти с ребёнком?" type="text"> <button class="search_button"></button> <button data-bind="visible: term, click: clearSearch" style="display: none;" class="clear-search">×</button> <div class="search-results" data-bind="visible: search" style="display: none" onclick="_gaq.push(['_trackEvent', 'Search_1', 'Click']); yaCounter16646506.reachGoal('SEARCH_1'); return true;"> <p data-bind="visible: showLoader" class="search-preloader" style="display: none"></p> <p data-bind="visible: allResults, click:showAllResults" class="search-show-all" style="display: none">Показать все результаты для <span data-bind="text: term"></span></p> <p data-bind="visible: noResults" class="search-no-results">По запросу <span data-bind="text: term"></span> ничего не найдено</p> <ul data-bind="foreach: categories, visible: showCategories"></ul> </div> <div class="search-overlay"></div> </div></label>превращается в: <div class="what"> <label for="search-what-field">Что</label> <div id="middle-search-app"> <input id="search-what-field" name="term" autocomplete="off" data-bind="value: term, valueUpdate: 'afterkeydown', attr:{placeholder: placeholder}" value="" placeholder="Куда пойти с ребёнком?" type="text"> <button class="search_button"></button> <button data-bind="visible: term, click: clearSearch" style="display: none;" class="clear-search">×</button> <div class="search-results" data-bind="visible: search" style="display: none" onclick="_gaq.push(['_trackEvent', 'Search_1', 'Click']); yaCounter16646506.reachGoal('SEARCH_1'); return true;"> <p data-bind="visible: showLoader" class="search-preloader" style="display: none"></p> <p data-bind="visible: allResults, click:showAllResults" class="search-show-all" style="display: none">Показать все результаты для <span data-bind="text: term"></span></p> <p data-bind="visible: noResults" class="search-no-results">По запросу <span data-bind="text: term"></span> ничего не найдено</p> <ul data-bind="foreach: categories, visible: showCategories"></ul> </div> <div class="search-overlay"></div> </div></div>Ну и CSS соответственно поправить придется.
  14. Я - начинающий верстальщик, принимаю заказы на верстку сайтов и лендингов. Верстаю кроссбраузерно (IE8+), валидно (в разумных пределах, конечно), адаптивность, умею JavaScript + jQuery (не профи, но на базовом уровне), Bootstrap 3, натягиваю на Wordpress. Космических скоростей выполнения не гарантирую (по понятным причинам). Зато буду брать пунктуальностью и внимательностью к деталям. Контакты: Skype: zenwarr E-mail: zenw@yandex.ru ICQ (для ретроградов): 437999463
  15. Инструменты усложняются, но и работа верстальщика тоже усложняется со временем. Ну, пусть даже появятся со временем инструменты, которые будут автоматически генерировать верстку приемлемого качества из несложных макетов. А как этот инструмент будет генерить, допустим, адаптивные шаблоны? Динамику? А как же веб-приложения? Верстка это уже давно не только раскраска текста и расстановка блоков по координатам, а еще и программинг. Со временем планка будет подниматься, рутинной работы типа "сверстать сляпанный дизайнером за пять минут шаблон" будет меньше, творческой, сложной (которая, как правило, ближе к кодингу) - больше. Вот такое у меня мнение.
  16. zenw

    CSS3 filter

    http://jsfiddle.net/3d3CF/ filter работает пока только с префиксами и только в вебките.
  17. zenw

    clearfix

    Подозреваю, что для того, чтоб скрыть точку, которая генерируется в div:after правилом content: "."
  18. zenw

    border и outline

    Относительно outline - нет, не обязательно. Положением рамки outline можно управлять через outline-offset, и смещать ее хоть внутрь контента, хоть на любое расстояние снаружи.
  19. Вы явно что-то делаете неправильно (возможно, применяете counter-reset на общем родителе обоих блоков) http://codepen.io/anon/pen/Gtjkx/
  20. Вы задали ширину спана в 33%, а потом добавляете иконки и левый padding в 25 пикселей. Выходит, что ширина каждого спана равна 33% + 25px, в результате общая ширина спанов получается больше 100%. Поэтому последний спан сползает.
  21. Действие далеко не одинаковое. * применяется ко всем элементам на странице, а html - только к корневому (html). Другое дело, что некоторые свойства наследуются от родительского элемента, и в некоторых случаях визуальных отличий действительно не заметно. Например, разницы между * { color: red; } и html { color: red; } при отсутствии других правил нет, но это не значит, что это одно и то же.
  22. Полюбопытствую: а почему min-height для html и body вы устанавливаете в 99.9%? Почему не 100%?
  23. Я сам не профи, но позволю несколько замечаний, то, что заметил. 1. фон заголовка в макете — градиентный, у вас же сплошной 2. <a href=""><i>in English</i></a>логичнее было бы, имхо, убрать тег <i> и заменить его правилом font-style: italic в CSS. 3. <h3 class="facebook">Мы на <a href="">Facebook</a></h3>не вижу смысла оборачивать этот блок в h3, это ведь не заголовок. Обычный div подошел бы больше, тем более, что в ТЗ сказано: и в таком случае логичнее было бы сделать список с одним элементом. Сюда же относится жестко заданный margin-top у поискового инпута ниже - при добавлении еще одной ссылки верстка сползет. 4. у вас список в двух независимых блоках. Можно было бы сделать, как мне кажется, используя CSS3 колонки, либо еще что-либо. 5. фон поискового инпута очень сильно отличается от фона в макете, кроме того, нет внутренней тени, иконка лупы прижата к краю (в макете есть отступ). В форме нет кнопки отправки (было бы логично сделать ее именно иконкой лупы), что делает невозможным отправку формы без дополнительного js. 6. тень прикрепленной к краю окна фиговины справа сильно отличается от макета. 7. насколько я понял, у первого слайдера должно быть 4 страницы, а не 5, как у вас. Это становится ясно, если включить отображение направляющих в ФШ (Ctrl+. Кроме того, не вижу смысла в таком слайдере, как у вас - зачем это, по одному пункту пролистывать? 8. со вторым слайдером и так понятно, что он очень сильно отличается от нужного вида - не хватает страниц, кнопки не там. 9. в подписи статьи не хватает курсива 10. блоки в футере расположены неправильно, смещены по горизонтали. 11. не понимаю, зачем подключать одновременно и reset.css, и normalize.css. Выберите что-либо одно. 12. jquery и скрипты слайдера подключаются дважды - в начале body и в конце. Ну, как-то так. Чего только не сделаешь, только бы не работать)
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy