SelenIT
-
Posts
4,327 -
Joined
-
Last visited
-
Days Won
140
Content Type
Profiles
Forums
Calendar
Store
Everything posted by SelenIT
-
Не оно случайно (особенно вариант с clear:right)?
-
В чем фактическое отличие display: inline и float: left
SelenIT replied to TonKhaO's question in HTML Coding
Вкратце как-то так: Инлайн - это обычная строка текста. Она переносится по словам (если инлайновый элемент обвести рамкой, при переносе эта рамка разорвется), учитывает соседние пробелы, последующий текст продолжается в той же строке. Инлайны подчиняются text-align (в частности, их можно центрировать). Плавающий блок - это, как справедливо отмечено выше, именно блок (строки текста переносятся внутри него, рамка получается сплошная), пробелы между закрывающим тегом и следующим не учитываются, последующий текст "вытесняется" в незанятое соседнее пространство и там переносится по строкам как обычно, столько строк, сколько уместится по высоте блока. "Выпадают" из контейнера (не влияют на его высоту, если нет последующих блоков с clear или отдельного контекста форматирования, напр. через overflow:hidden). Ширина блока по умолчанию ужимается по контенту. Может прижиматься только к правому или левому краю, центрировать нельзя. По вертикали всегда выравниваются по верхней границе. Бывают проблемы в IE6. Есть еще inline-block: внутри он ведет себя как блок (сплошной прямоугольник, может содержать несколько строк и т.п.), а снаружи - как строчный элемент (слово текста в рамке или картинка). Соседние пробелы учитываются, последующий текст идет в одну строку, продолжается после блока. Ширина блока по умолчанию ужимается по контенту. Не "выпадают" из контейнера. Подчиняются text-align (можно центрировать). Могут выравниваться по вертикали с помощью vertical-align (по верху, низу, центру, базовой линии текста и не только). Требуют небольшого хака в IE6-7 и аццких хаков в (к счастью, практически вымершем) FF2. Ссылки про float-ы: раз (почти исчерпывающая), два. Про inline-block - например, вот (см. тж. комменты). Еще была когда-то хорошая статья Томми Олссона (http://www.autisticcuckoo.net/archive.php?id=2005/01/11/block-vs-inline-1), но сейчас его сайт лежит с ошибкой (нашелся только немецкий перевод). -
html{ overflow:auto; }для документа в ифрейме должно помочь.
-
Почему меняются правила HTML разметки, если поместить код в ячейку таблицы?
SelenIT replied to xexsus's question in HTML Coding
Видимо, получалась циклическая зависимость: ширина блоков должна браться от ширины таблицы, но та в случае длинного содержимого должна браться по контенту. Поэтому контент и распирал таблицу на всю свою фактическую ширину и не обрезался. Table-layout: fixed; эту зависимость от ширины контента убирает. -
Почему меняются правила HTML разметки, если поместить код в ячейку таблицы?
SelenIT replied to xexsus's question in HTML Coding
А что в маленьком примере с кодировкой? И что за символы перед доктайпом - BOM-метка? -
Имхо, сюда напрашивается добавочная таблица связей (search_id, product_id). Тогда подсчитать кол-во соответствий можно будет обычным джойном, без мучений с лайком. Тем более, что лайк с '%' в начале всё равно не сможет использовать индексов...
-
С <p> не перепутали случайно? В <li> блоки пихать можно. Собственно, возможность вложенных списков на этом строится. Плюс редко, но бывает необходимость сделать, например, список блочных цитат с подписями или ленту новостей с заголовками и анонсами...Вот в <a> пихать блоки можно только в HTML5 (в браузерах это уже работает, но в IE может глючить курсор при наведении).
-
Разве что отогнать текст пустышкой подходящего (как минимум не меньшего, чем врезка) размера, а саму врезку отпозицинировать поверх пустышки абсолютно... Или яваскриптом, оставить в нужном месте пустой плавающий плейсхолдер, а после загрузки врезки сделать document.getElementById("id_плейсхолдера").appendChild(document.getElementById("id_врезки")) - правда, в момент срабатывания верстка дернется (как бывает при догрузке картинок с незаданными размерами) и при отключенных скриптах, увы, придется врезке побыть концевой сноской. Других вариантов (по крайней мере, до массовой поддержки template layout'ов и подобных радостей CSS3) не вижу...
-
Запоздало, но от души присоединяюсь к поздравлениям и пожеланиям!
-
Между тегами. Был про это топик на Хабре (я сам долго не верил, пока не поэкспериментировал).
-
Иконка в H2 - как вертикально центрировать?
SelenIT replied to PoshtarBoba's question in HTML Coding
Почему? Если иконка - именно оформление, а не иллюстрация... Если хотя бы ширина иконок фиксирована - можно извернуться как-то так... <!DOCTYPE html> <title>h2</title> <style> h2 * { vertical-align: middle; } h2 span { display: inline-block; padding-left: 50px; } h2 img { margin-right: -50px; } </style> <h2><img src="icon.gif"><span>Текст в 1 строку</span></h2> <h2><img src="icon.gif"><span>Текст подлиннее в 2 строки</span></h2> <h2><img src="icon.gif"><span>Очень-очень длинный-предлинный текст в целых 3 строки</span></h2> Но по-моему фонами - лучше всего. -
psywalker, если делать списком - в IE7 (включая IE8-притворщика) и ниже пробелов между элементами списка не будет, они тупо игнорируют закрывающий </li>. А здесь эти пробелы критичны...
-
Почему +1? Месяцы-то в JS с нуля нумеруются (для удобства использования в индексах массивов). Первый код - абсолютно правильный, ищет "нулевой день марта" = последний день февраля, что и требуется. По сути, второй раз вызывать new Date() даже не надо, эти даты и так совпадают. О високосных годах тоже беспокоиться незачем, new Date() учитывает все эти вещи сам.
-
Можно пропорционально растянуть пробелы между пунктами. Не самый красивый пример навскидку: <!doctype html> <title>test</title> <style> .menu { text-align: justify; } .menu a { display: inline-block; border: 1px solid; padding: 1em; } a:hover { text-decoration: none; color: green; } a.end { width: 100%; height: 0; overflow: hidden; padding: 0; border: 0; } </style> <!--[if lte IE 7]> <style> .menu a { display: inline; zoom: 1; } </style> <![endif]--> <div class="menu"> <a href="#">Новости</a> <a href="#">Свадьба</a> <a href="#">Семейные праздники</a> <a href="#">Детские праздники</a> <a href="#">Корпоративы</a> <a href="#">Кейтеринг</a> <a href="#">Форум</a> <a class="end"></a> </div> Не список, потому что LI с фактическим display:inline-block странно воспринимаются IE6-7...
-
Шрифт, нарисованный на CSS
-
С vertical-align можно поиграться... top или middle попробовать (возможно, вдобавок к line-height). Но вообще идея про фоновую картинку - самая правильная. В этих <li> точно ссылок нет, случаем? Можно было бы сделать фоном для #menu li a...
-
В качестве варианта для затравки: <!doctype html> <style> .left_bg { background: #ccf; min-width: 400px; overflow: hidden; } .right_bg { float: right; background: #fcc; width: 50%; padding-left: 30px; border-left: 70px solid #ccc; } .left { float: left; width: 100%; margin-left: -100%; } .left .content { padding: 10px 100px 10px 10px; } .middle { float: left; width: 70px; background: #ccc; margin-left: -100px; } .middle .content { padding: 10px; } .right { float: left; width: 100%; margin-left: -30px; } .right .content { padding: 10px; margin-right: -30px; } </style> <div class="left_bg"> <div class="right_bg"> <div class="left"> <div class="content"> <p>Left column content</p> </div> </div> <div class="middle"> <div class="content"> <p>Mid. col. content</p> </div> </div> <div class="right"> <div class="content"> <p>Right column long text content</p> </div> </div> </div> </div> Правда, проверял пока только в FF3.6...
-
Замена $_POST на $_REQUEST в плане "защиты" - с чем боролись, на то и напоролись. Опасность register_globals в том, что подсунуть данные можно любым путем (хоть постом, хоть гетом, хоть куками), $_REQUEST - та же ерунда в профиль. Но вообще у этого скрипта странная логика. Я бы делал всё последовательно. Сначала проверил, пришли ли нужные пост-данные. Если не пришли - вывел бы форму с требованием их ввести, дергать базу в этом случае вообще бессмысленно. А вот если пришли - тогда есть смысл коннектиться к базе, делать запрос и выводить сообщение об успехе или ошибке в зависимости от его результата (наподобие примера Ялекса)...
-
Это CSS2.1. Но это не весь CSS, существующий на сегодняшний день (как минимум), а с CSS3 уже не всё так просто...
-
Имхо, тем, кто озабочен "валидацией CSS", полезно сперва прояснить для себя, что это такое (hint: валидность HTML/XML - соответствие приложенной схеме, а где указывается схема для CSS и указывается ли вообще?)...
-
Нельзя. Ссылку в ссылке через таблицу-прослойку "воспринимает" как раз только IE, а вообще это ошибка с непредсказуемым результатом, работать "вложенные ссылки" скорее всего не будут. Сделайте общую обертку для ссылки и ее подсказки (напр. div) и задавайте эффект для нее, а для IE6 (если его поддержка важна) используйте JS-костыль типа whatever:hover. Или сразу делайте подсказку на JS, есть неплохие готовые решения с JQuery и т.п., с плавным появлением, подгонкой к границам окна и прочими плюсами. И еще, вкладывать блочное в строчное (table в span в данном случае) — тоже ошибка.
-
По-моему, XML и HTML5 нисколько не противоречат друг другу. Первое — инструментальная база (со всеми ее плюсами в виде простого парсинга, неограниченной расширяемости, кучи стандартных средств для обработки, выборок и преобразований и т.п., и минусами в виде драконовского контроля ошибок и неопределенности семантики и дефолтного отображения), второе — сборная солянка из унифицированного словаря, кучи унифицированных же интерфейсов всего ко всему (заточенных под реальные задачи) и двух взаимозаменяемых стандартных и однозначных синтаксисов, один их которых дает бонус нефатальности ошибок, а второй — сюрприз — является XMLем . Можно объединить их плюсы — XHTML5. Кстати, менюшки в HTML5 тоже могут быть вполне себе семантичными...
-
Я бы сказал, что не "еще лучше", а только второй вариант и есть правильный. Первый — разве что для каких-нибудь совсем уж художественных изысков...
-
Для IE это лишь комменты. Непонятно только, кого таким макаром обманываем — то ли валидатор, то ли всех остальных...
-
Нет, обернуть скрипты в CDATA, заэкранировав соотв. метки: <script type="text/javascript"> //<![CDATA[ здесь скрипт //]]> </script> Еще лучше выносить скрипты в отдельный файл. P.S. И стоил этот XHTML таких мучений?