Arinden

Большое вам спасибо!.. Картина проясняется. Попробую поэкспериментировать...

Почему-то не работает. Я слабо понимаю JQuery и JavaScript в целом, но по моей логике как раз-таки должно работать. Не могу придумать причину по которой не работает. Возможно переменная передаёт значение как текст, а не как свойство?... Вот так работает: http://jsfiddle.net/XgZxs/20/ Слегка отредактировал с применением кода от alexriz. Но я не понимаю, что он делает. Господа, вы не могли бы объяснить "на пальцах", для чего нужно: var x = {}; x[y] = '+=200'; и почему после этого я могу исключить скобки {} в animate и самое главное!! почему оно начинает работать?..

Большое спасибо, попробую разобраться!

Всем доброго дня! Остро встал вопрос о необходимости использования переменной для .animate в JQuery, а именно: $(".block").click(function(){ var y = '"top"'; $(".block").animate({y: "+=200"}, "fast"); }); Вышеуказанный код не работает. Если "y" заменить на "top" - работает, но мне нужна переменная. Пробовал разные варианты и не получается. Требуется ваша помощь, дайте наводку пожалуйста.

Так и есть. В текущем CSS, насколько мне известно, нет. Только тупо подгонять line-height для каждого конкретного шрифта... Большое спасибо!

Я пользуюсь библиотекой google. Вот так: <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> И качать ничего не нужно. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script> $(document).ready(function(){ $(".news").click(function(){ $(".news_table").toggle().slide(); }); }); </script> ?

Я для себя делаю.. Понимаю что, возможно я много требую и хочу, просто люблю, когда всё ровно и чётко. Если отступы везде 5 пикселей, то и здесь должно быть также, ровно до края буквы. И поэтому выискиваю метод реализации. Понимаю, что сюда и JS прикрутить можно, описать размеры каждой буквы и т.д. и т.п., но неужели нет простого решения, чтобы всё выглядело как у всех, но при этом было ровно... Или в таких случаях проще "плясать от обратного" и делать отступ не 5px, а 2, учитывая что 3 уже учтено в шрифте?

Вот наглядный пример. Сверху - то что мне нужно. Чтобы бралась только "чистая высота буквы", но попробуйте выделить текст. Выделение имеет отступ снизу, но его нет сверху, из-за Line-height, а вот ниже вариант без line-height, где мы видим, что изначально сохранён отступ под буквы Й и Ё, даже если их удалить. Но зато выделение текста имеет равный отступ сверху и снизу. Мне нужно как в первом варианте, я думаю это делается не через line-height.

Пример. P.S. не забудьте подключить JQuery.

Снова поднимаю эту тему. Дело в том, что при использовании line-height выделение текста ограничивается line-height и буквы Ё Й выделяются как Е и И. А мне надо, чтобы они обрабатывались по высоте как Е и И, но при выделении вели себя полноценно....

selevit, у меня в Chrome (17.0.963.56 m), если кликнуть на Поиск - он удлиняется, но затем, после клика в другую часть экрана, поиск сужается обратно, а вот синяя обводка от него остаётся в удлинённом состоянии.

Просто у меня всегда сомнения на тему того, правильно ли я делаю. Мне свойственна нестандартная логика, поэтому в коде могу такого наворотить, что ЦП будет на 100% )), а знающий человек в одну строчку уместит. Как вариант, спасибо. Кстати да, можно же просто плюс написать , а я почему-то думал, что его нужно вычерчивать, либо заливкой попиксельно как-то. Спасибо.

Всем добрый вечер. Возник вопрос, не могу найти способ реализации нечто похожего на ТЕКСТ——————— и беспрерывной линии определённой длины. Скажем заголовок, а после него по центру текста идёт линия, до конца блока или на определённую длину. Без создания form. Единственное, что приходит в голову, это создание блока 1/2 высоты с boder-bottom, но это "некрасиво" как-то. Может есть какой способ? И ещё, как можно создать знак + в квадрате, такие как в проводнике, не прибегая к использованию изображений. Спасибо. P.S. Это подходящий вариант?

Запомни, что если у тя есть поля формы, то всегда оборачивай их в контейнер, и перевешивай на него бордеры, паддинги. А самим полям уже задавай 100% ширины, и никаких паддингов. Эти вещи строго контейнеру. Так и сделал, но в IE вообще не работает. Только с хаком. И я имею ввиду не паддинг формы, а паддинг текста внутри текстарии. Нужно мне с этим поэкспирементировать.

Если не брать в расчёт такую мелочь, как выглядит ваш сайт на моём компьютере: То сделать это можно: #info { width: 700px; margin-left: auto; margin-right: auto; font-family: 'Open Sans', sans-serif; } И обратите внимание, на повторяющиеся теги head и body.

А как для блока width: 100%; можно назначить padding для текста? Cкажем есть у меня <textarea> с width: 100%; и если я применю padding: 0 5px; то будет уже 100%+10px

Вы вставили код не туда, куда я написал.

Вставляем под <hgroup> <ul class="social_icons"> <li> <a href="https://plus.google.com/u/0/b/113849177854176102811"> <img src="http://darkhill.ru/wp-content/themes/twentyeleven/google_plus.png" alt="" /> </a> </li> <li> <div id="___plusone_0" style="height: 15px; width: 24px; display: inline-block; text-indent: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; background-attachment: scroll; background-repeat: repeat; background-image: none; background-position: 0% 0%; background-size: auto; background-origin: padding-box; background-clip: border-box; background-color: transparent; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; float: none; line-height: normal; font-size: 1px; vertical-align: baseline"> <iframe allowtransparency="true" frameborder="0" hspace="0" id="I1_1330265771869" marginheight="0" marginwidth="0" name="I1_1330265771869" scrolling="no" src="https://plusone.google.com/_/+1/fastbutton?url=http%3A%2F%2Fdarkhill.ru%2F&size=small&count=true&annotation=none&hl=ru&jsh=m%3B%2F_%2Fapps-static%2F_%2Fjs%2Fgapi%2F__features__%2Frt%3Dj%2Fver%3DqpAaYv4Gceo.en.%2Fsv%3D1%2Fam%3D!4ArSr93f4LuIjcmMGw%2Fd%3D1%2F#id=I1_1330265771869&parent=http%3A%2F%2Fdarkhill.ru&rpctoken=887739263&_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe%2C_renderstart" style="width: 24px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; position: static; left: 0px; top: 0px; visibility: visible; height: 15px" tabindex="-1" vspace="0" width="100%" title="+1"></iframe> </div> <script type="text/javascript"> window.___gcfg = {lang: 'ru'}; (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script> </li> <li> <a href="http://vk.com/darkhill_ru"> <img src="http://darkhill.ru//wp-content/themes/twentyeleven/vkontakte.png" alt="" /> </a> </li> </ul css .social_icons { position: absolute; right: 0; list-style: none; } .social_icons li { float: left; margin-left: 5px; } иконки прыгают из-за свойства branging img {margin-bottom: -7px;} уберите его.

Хорошо, спасибо!

Ясно... Видимо это столь великая тайна, что мне не суждено её осознать. Будем пытаться.

Друзья, я не могу объяснить, до чего я пытаюсь докопаться. К сожалению, я ещё не узнал ответ на свой вопрос... Давайте вернёмся к "кубикам". Я в песочнице сделал банальный пример. Три блока. Если просто создать три дива - они идут в столбик. Далее идут коричневые блоки, это то, как я их размещаю в одну линию при помощи float (то как я всегда делаю со всем абсолютно и располагаю это именно так, как мне это нужно). Ниже, фиолетовые блоки - это display: inline-block (плюса от этого я не увидел. + создаются дополнительные отступы, которые убирать нужно лишними строчками кода). И наконец, золотые блоки, это display: table-cell (не кроссбраузерно, как оказалось, и опять таки не так удобно как float). Так вот опираясь на данные примеры, делаем вывод, что от выбора типа расположения блоков зависит код вебсайта, ведь блоков у меня десятки. Вопрос, как "профессионально" размещать блоки в одну линию? каким способом? может я его вообще не указал. И вопрос сразу после этого - как разместить эти же блоки, если их не 3, а 6, и требуется, чтобы 3 было в один ряд и три в другой.

Максим, спасибо за пример, но дело в том, что я имел ввиду, что вместо div'ов могут быть другие теги, скажем textarea, input, p, button и т.д. Вот я сделал другой пример. Я сделал резину (первая в жизни), как и ты. Хотя в примере я говорил о фикс. Вот вопрос в следующем, если мы имеем все эти теги в одном блоке, и, предположим, у всего фиксированный размер высоты и ширины - как правильно их расположить без использования флоат? А чем так плох float для IE 8+?

Вот. Взгляните - я накидал на скорую руку пример блока со смешанным контентом внутри (я сделал всё дивами, но в айди присвоил название того тега, который там может быть, просто песочница неточно отображает размеры инпута, текстарии и сабмит баттона). Размеры взял как получилось, но на деле всё должно быть пиксель перфект. Тоесть расстояние, например, между картинкой и текстарией должно быть не ажбы какое, а скажем ровно 10 пикселей (не могу кстати понять, если задаю display: inline-block; - получается отступ в 4 пикселя, и чтобы его убрать нужны хаки, а с флоат - вообще ничего не надо). Для реализации данного примера мне понадобилось проставить свойство флоат абсолютно для всего. Вот о чём я и говорил. И если делать сайт дальше, то ничего не меняется, десятки и сотни флоатов везде. Научите меня пожалуйста на данном примере, как можно реализовать это профессионально и правильно. Табличную вёрстку прошу не предлагать, идёт отторжение .

По такому принципу.

Да ко мне тоже закрадывается желание отказаться от поддержки out of date браузеров. А за использование IE-6 нужно вообще уголовную ответственность вводить.