Leaderboard
Popular Content
Showing content with the highest reputation on 08/10/2011 in Posts
-
Приблизительно так тогда <!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> <style> html, body {width: 100%; height: 100%; padding: 0; margin: 0;} label.error {display: none; font-size: 12px; padding: 2px; margin-left: 10px;} input.invalid + label.error {display: inline-block; } </style> </head> <body> <form method="get" action="" style="margin: 50px;"> <input type="text" placeholder="Test" required id="test"><label class="error">Что то пошло не так ... </label> <br><br> <input type="submit" value="Submit"> </form> <script> var test = document.getElementById('test'); test.addEventListener('invalid', function(e){ e.preventDefault(); this.classList.add('invalid') }, false); test.addEventListener('input', function(e){ this.classList.remove('invalid'); }, false); </script> </body> </html>2 points
-
Раз макет фиксированной ширины, то можно ссылку разместить справа от макета через position: fixed; left: 50%; margin-left: ширина макета/2; Ну и скрипты никто не запрещал.2 points
-
Уже давно всё аргументировано. http://forum.htmlbook.ru/index.php?showtopic=28292&view=findpost&p=2134022 points
-
ммм... Оказывается надо пояснить. картинка сверху - это 1. Далее картинки-инкременты По многочисленным просьбам: правила. Игра начинается с картинки с цифрой 1, далее картинки с явно угадывающимися 2, 3, 4, 5 и так далее. Приветствуются: неординарность, некапитаночевидность, юмор, необычность и креативность в представлении цифр на картинках. Да, и товарищи, не выкладывайте неподъемные простыни, вываливающиеся за габариты.1 point
-
Протуберанец, что это означает???1 point
-
Да, на CSS3 можно даже красиво (правда, не совсем открытие-закрытие, но тоже ничего). Но IE8-, увы...1 point
-
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> <style> html, body {width: 100%; height: 100%; padding: 0; margin: 0;} </style> </head> <body> <form method="get" action="" style="margin: 50px;"> <input type="text" placeholder="Test" required id="test"> <br><br> <input type="submit" value="Submit"> </form> <script> var test = document.getElementById('test'); test.addEventListener('invalid', function(e){ e.preventDefault(); e.stopPropagation(); alert('Вот так ') }, false) </script> </body> </html> http://afarkas.github.com/webshim/demos/demos/webforms.html UPD: http://jsfiddle.net/NekR/K4MR4/ И ещё что то в таком духе ... http://jsfiddle.net/NekR/K4MR4/3/1 point
-
Та ну эта опера деревянная какая-то, особенно последние версии. Чуть лучше IE9. Хром самый толковый браузер, ну и мозила старается держать марку не отстает. Но хром удобнее и быстрей всех, по моему мнению.1 point
-
Ставить нужно то в чем вы хорошо разбираетесь1 point
-
rediskavet, только модель E34 приходит в голову, оно? p.s. эй, кто меня заминусовал? Не понравилась загадка?1 point
-
неа, совсем не вариант. У меня это решение родилось сразу же, как только задачу поставили. Но дело в том, что ее зафиксировать надо в одном месте. А ширина экрана будет разной. Т.е. ни с левой стороны, ни с правой нельзя отмерить позицию ссылки.1 point
-
Softlink, А сделать ссылку fixed не вариант? a { height: 100px; position: fixed; right: 0; top: 300px; width: 200px; }1 point
-
Без бордеров и паддингов элементы форм выглядят на порядок более уродски, чем по дефолту. Для меня этого аргумента достаточно, чтобы забыть о * {...} в реальных проектах. Не говоря о том, что оно создает лишнюю работу браузеру (при рендеринге) и кодеру (при приведении нечитаемой слипшейся каши обратно в удобоваримый вид). Хоть какое-нибудь выделение для :focus-то верните (тенюшку какую-нибудь ненавязчивую, что ли). А то сломается у вас мышка по закону подлости — ох, вспомните вы эту несчастную пунктирную рамку, которая вам лишь помочь пытается...1 point
-
А можно ли узнать в каком формате победители получат книги и откуда их выбирать?1 point
-
Есть технические доводы и "идеологические". - Универсальный селектор применяет стиль ко всем элементам веб-страницы, включая невидимые, что приводит к замедлению браузера, поскольку ему требуется некоторое время для построения дерева элементов и добавления к ним стилей. Чем больше элементов в коде, тем сильнее выражено замедление. В некоторых крайних случаях вообще может появиться «зависание» браузера на несколько секунд. - При неверном использовании универсального селектора результат может оказаться непредсказуемым. Пример ниже является полностью корректным с точки зрения CSS, но приводит страницу к парадоксальному виду. * { display: block; border: 1px solid #c00; } - «Обнуление стилей» прививает у разработчика дурную манеру вёрстки. Вместо того чтобы знать, какие значения свойств установлены по умолчанию, разработчик перекладывает эту работу на браузер, насильно устанавливая все значения в ноль. В результате некоторые значения применяются к свойствам, для которых не могут устанавливаться или к свойствам, у которых данное значение и так нулевое. Это опять же приводит к повышению нагрузки на браузер и замедлению его работы. - Применение одного стиля сразу ко всем элементам иногда приводит к ошибкам отображения элементов в отдельных браузерах. В примере ниже к ссылкам добавляется пунктирное подчеркивание, которое не показывается в IE7 из-за заданного обнуления полей у ссылок. * { padding: 0; } a { text-decoration: none; border-bottom: 1px dashed red; } Замечу также, что reset.css тоже не следует использовать в том виде, что привёл buddah. Сам Мейер неоднократно заявлял, что этот код всего-лишь основа для собственных изменений. Об этом или забывают или не желают знать. В итоге используют код, который заведомо излишен. Вот скажите, кто в последний раз использовал тег h6? А может вы активно применяете тег ruby и не представляете страницу без него? Короче, перед использованием чего-либо подобного, подумайте вначале и подредактируйте его "под себя", а не вставляйте бездумно, как это делает большинство.1 point
-
i am osel. кнопку включения/отключения вай-фай адаптера на корпусе ноута обнаружил на третий день только. такая она сцука неприметная, что после первого исследования позавчера подумал что нету.1 point
-
Поменяй на width: 100%;1 point
-
ну. .element1 {color:red;} .element1.add {color:green;}1 point
-
Кармы больше — писька растёт, кармы меньше — писька уменьшается.-1 points
-
я тут хитро завернул. Ключевое слово "круглосуточно"=24 часа)-1 points
-
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> <style> html, body {width: 100%; height: 100%; padding: 0; margin: 0;} textarea {overflow: hidden;} </style> </head> <body> <textarea></textarea> </body> </html> С каких пор такой код перестал работать?-1 points
This leaderboard is set to Kiev/GMT+02:00
-
Upcoming Events
No upcoming events found -
Сообщения форума
-
Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение. .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } } -
Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок. -
By Katerina23 · Posted
Да, подходит. Спасибо. -
<input type="number"> -
By Katerina23 · Posted
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-