Great Rash
Expert-
Posts
7,974 -
Joined
-
Last visited
-
Days Won
144
Content Type
Profiles
Forums
Calendar
Store
Everything posted by Great Rash
-
помогите разобраться почему контент наесжает нафутер
Great Rash replied to mrfrunze's question in HTML Coding
.body { overflow: hidden; } -
ul.nav { width: 1100; margin: 0 0 0 70px;}По стандарту везде должны быть указаны единицы измерения. У вас они не указаны. Почему не работает mask не знаю, это плагин jQuery - посмотрите более свежую версию (у вас на сайте и jQuery семилетней давности 1.7.2), может имеет смысл обновиться до 1.11? Ну или почитать документацию к существующему плагину. Вот их сайт, там уже версия 1.3.1 имеется.
-
Смените доктайп на человеческий. У вас сейчас стоит transitional, это заставляет ИЕ свалиться в режим совместимости.
-
Трудно что-то сказать по тем скудным сведениям, что вы предоставили. Может попробуете установить min-width для <body>? html, body { min-width: 1000px;}
-
Читайте весь цикл статей.
-
Если вы пытались семантику тут замутить, то у вас пока плохо выходит. <div class="work"> <img src="images/arrow-work.png" alt=""> <h1>Latest works</h1></div>С точки зрения семантики у вас бессмысленный блок, т.к. <h1> относится только к <div> в который он вставлен. Лучше сделать так: <h1 class="work"> <img src="images/arrow-work.png" alt=""> <div>Latest works</div></h1>В таком случае заголовок будет относится к блоку с текстом.Ну и слишком много <h1> у вас. Разбейте страницу второстепенными заголовками (h2, h3, h4 и т.п. по степени важности контента), особенно учитывая то, что у вас нет ни одного <section>. А вообще я не сторонник семантики, как по мне - это всё бесполезная фигня.
-
Вы JavaScript знаете?
-
Поисковики не дураки, они склеют просто эти страницы при выдаче.
-
Пофиг абсолютно.
-
margin: left;
-
CSS animation и transition на одном элементе. Баг (?) в FF.
Great Rash replied to ows.nightwolf's question in HTML Coding
Стандарт находится в состоянии working draft (черновик), так что браузеры в принципе не должны гарантировать нормальную работу этих фич. Ну и реализация в разных браузерах может сильно отличаться. -
В стиль для таблицы. Вы же таблицу анимируете так?
-
Или margin в нужную сторону, или связка position: relative; + left в нужную сторону
-
Небольшое предисловие: В компании, где я работаю, строго запрещено иметь нелицензионный софт, поэтому иногда приходится извращаться. Если вы ярый сторонник торрентов, то можете смело проходить мимо, ибо для вас всё сильно проще. А остальным я предлагаю решение, которое я гуглил месяцами, но все равно не нашел ничего похожего. Наткнулся я на него совершенно случайно. Итак погнали... Задача: сгенерировать иконочный шрифт из макета, который нам отдали в PSD. Что нам понадобится: 1) Photoshop (думаю версия не имеет значения, например у меня CS5) 2) Inkscape (опенсорсный векторный редактор) 3) Любой текстовый редактор (у меня Sublime Text 2) 4) https://cloudconvert.org - сайт, который умеет конвертировать файлы в SVG 5) https://icomoon.io - генератор иконочных шрифтов Шаг первый: в макете находим нужную иконку, она должна быть векторная (т.е. это должен быть Shape), если иконка растровая, то её нужно конвертировать в вектор после этого нужно обрезать макет по размеру иконки (Crop Tool) Шаг второй: нужно убрать все слои, кроме необходимого нам (того, что с иконкой), для этого создаём новый файл (File -> New) и перетаскиваем в него нужный нам слой из макета, после этого сохраняем файл (File -> Save As), в появившемся меню выбираем формат .eps (Encapsulated PostScript) Шаг третий: лезем на сайт CloudConvert выбираем наш .eps-файл и конвертируем его в .svg, далее нужно очистить его от всего говна, которое образовалось там после конвертации Шаг четвертый: открываем получившийся .svg в любимом текстовом редакторе, ищем там тег <path />, кроме этого тега нам больше ничего не понадобится, всё остальное можно смело стирать, из самого тега <path /> удаляем все атрибуты, кроме d="" (там собственно путь) и стиля clip-rule (он отвечает за "дырки" внутри иконки). Шаг пятый: ручками делаем новый чистенький SVG <?xml version="1.0" encoding="UTF-8" standalone="no"?><svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="32px" height="32px" version="1.1"> <path style="clip-rule: evenodd;" d="<!-- тут собственно путь -->" /></svg>Шаг шестой (возможно необязательный): у меня после конвертации иконка получилась кверху ногами, да ещё и 15px превратились в 150px (т.е. размер увеличился в 10 раз), хз почему так. но чтобы это пофиксить нам понадобится Inkscape, создаём там файл нужного размера (например 32х32 - я обычно этот размер для шрифтов юзаю), загружаем туда наш .svg и отражаем его по вертикали и подгоняем под нужный размер, затем сохраняем как SVG (Inkscape опять надобавляет в код своего говна типа метаданных и прочей лабуды, по желанию вычищаем всё это оттуда) Шаг седьмой: лезем на сайт IcoMoon и генерим шрифт Всем спасибо за внимание! Предложения по улучшению моего алгоритма действий приветствуются. На возникшие вопросы обязательно отвечу.
-
Объясняю еще раз, для тех кто в танке: вы читаете документацию к инструменту, который предназначен для хайлоад-проектов. Если у вас посещаемость не сотри тысяч уников в сутки, то вам это всё не нужно. С точки зрения семантики по барабану где писать скрипты: в отдельном файле или же прямо в коде, т.к. поисковые роботы блоки со скриптами просто игнорируют при анализе страницы. С точки зрения поддержки сайта скрипты однозначно удобней хранить в отдельном файле. Если же у вас вообще лендинг, то можете хоть чередовать строчку скрипта со строчкой html-кода, т.к. лендинг делается один раз и навсегда, то вообще плевать как там всё сделано.
-
Всё вышенаписанное имеет смысл только для проектов с высокой нагрузкой на сервер. Гугль пишет, что внедряя стили на страницу вы уменьшаете нагрузку на сервер, т.к. при получении HTML-кода не делается отдельный запрос к серверу для получения скриптов. С другой стороны, пишет Гугль, если у вас есть большой кусок кода, который врядли когда то изменится (например тот же jQuery), то лучше хранить его в отдельном файле, т.к. он закешируется браузером и на сервер опять же не будет отправляться отдельный запрос, т.к. файл будет браться с клиента. Директива JsInlineMaxBytes - это директива Nginx для модуля PageSpeed (выдержку из документации к кторому вы тут привели). Повторюсь еще раз: если у вас не хайлоад-проект, то вам это всё нафиг не упало.
-
Ваш вопрос разрывает все шаблоны у меня в голове... Во-первых, у вас не чекбоксы, а радиобаттоны. Во-вторых, вы пишете "использование скрипта в стилизации", но при этом спрашиваете "какие классы должны стоять в input'ax и span для корректной стилизации". Вы уж определитесь, что вам надо: checkbox или radio, классы или скрипты.
-
Неправильное отображение в Safari и IE. Как исправить?
Great Rash replied to Johnney's question in HTML Coding
В таком случае у вас остаётся несколько выходов: 1) делать картинками (в таком случае часть карты будет некликабельна) 2) забить на старые браузеры (пусть там будет квадратное) 3) обсудить с заказчиком и дизайнером возможность перерисовки макета- 11 replies
-
- border-radius
- pie.htc
-
(and 5 more)
Tagged with:
-
Неправильное отображение в Safari и IE. Как исправить?
Great Rash replied to Johnney's question in HTML Coding
Я имею в виду. что надо задать стили не для фрейма, а для его родителя. Т.е. обернуть фрейм в <div> и ему уже задать радиус.- 11 replies
-
- border-radius
- pie.htc
-
(and 5 more)
Tagged with:
-
Неправильное отображение в Safari и IE. Как исправить?
Great Rash replied to Johnney's question in HTML Coding
Пробовали сделать так? <div style=”border-radius: 150px; width: 300px; height: 300px; overflow: hidden;”> <iframe></iframe></div>Никакой pie.htc вам не поможет. В ИЕ7 и в ИЕ8 вам придётся отказаться от круглых углов.- 11 replies
-
- border-radius
- pie.htc
-
(and 5 more)
Tagged with:
-
Этого я не знаю. надо изучать их API. По идее должно быть можно.
-
https://code.google.com/p/svg-edit/
-
А чем сайт знакомств отличается от интернет-магазина?