Leaderboard
Popular Content
Showing content with the highest reputation on 02/20/2012 in all areas
-
В Key Bindings можно сделать вот так и будет работать на Ctrl+D { "keys": ["ctrl+d"], "command": "duplicate_line" }, Есть вот такая настройка "draw_white_space": "selection", которая говорит о том что надо показывать пробельные символы, если текст выделен. Можно ставить none или all, чтобы изменить это поведение. В принципе, меня полностью устраивает вариант selection, так как посмотреть какие пробелы есть надо не так часто, и выделить кусок не сложно3 points
-
Ну.. Проще самому понять. Объяснить, чтобы стало понятно - сложнее. Попробую У нас есть div с классом - main. В нем содержится div с классом float-right и параграф. html <div id="main"> <div class="float-right"> float-text </div> <p> Some text, that we write here, or here, and many-many times again. Some text, that we write here, or here, and many-many times again. Some text, that we write here, or here, and many-many times again. Some text, that we write here, or here, and many-many times again </p> </div> Выглядит это просто. Идет надпись float-text, а ниже Some text и тд. Далее зададим стили для div с классом float-right, чтобы было более наглядно. + чуток стилей на родителя и на параграф. #main{ background:#eeb0b7; } .float-right{ background:#f00; height:300px; width:300px; } p{ margin:0; } В итоге - то же самое. float-right (далее ФР) вверху, параграф внизу. Единственное - добавили стилей ФР. Далее флотнем наконец ФР .float-right{ background:#040; float:right; <<< height:300px; width:300px; } Что увидим в итоге. ФР сместился вправо. Параграф поднялся (!!!) вверх, но при этом обтекает наш флотнутый див. Сам же main сомкнулся и теперь занимает место равное размерам параграфа - это можно проследить по бекграунду, что мы задали на main. (кто слышал такую вещт как хезЛейаут - это оно и есть - размеры main теперь полностью зависят от размеров параграфа - хезлейаута нету. Кто не слышал - не вникайте даже) Будет ещё время ) Наша задача сделать так, чтобы main учитывал и флотнутый в нем ФР! Как это сделать. Есть два способа. 1. Задать на меин overflow:hidden. Описание этого свойства часто вводит тех, кто пытается разобраться в заблуждение. Написано - при переполнении, контент, что выходит за границы - обрезается. Но! Причем здесь флоты и тд? Ответ прост Переполнение возможно только, если заданы четкие размеры. Высота, ширина. А у нас блок размеры которого зависят от содержимого! Соотв. записывая overflow:hidden в стилях на наш блок, мы как бы застявляем его растягиваться по ВСЕМУ содержимому, что в нем. Или проще - задаем ему hasLayout (по-моему так пишется ) #main{ background:#eeb0b7; overflow:hidden; <<< } В итоге увидим, что бекграунд растянулся на всю высоту флотнутого блока. 2. Если оверфлоу хидден поставить по каким-либо причинам нельзя (о причинах лучше потом ) - используется after! #main{ background:#eeb0b7; width:100%; <<< (!!!) } #main:after{ clear:both; content:''; display:block; } Тут подробнее. Сразу скажу - width:100% - для ИЕ. Остальные и без этого работают. Далее про сам афтер. ты сам уже попробовал. Если создать пустой блок после нашего - все будет работать. Почему? Всё просто. Этот пустой блок как бы занимает ВСЁ место нашего блока. Включая флотнутый элемент. А потому - все что после этого пустого блока - не "налезают" на флотнутый ФР. Используя афтер мы делаем тоже самое! #main:after{ /* - делаем что-то, что будет идти после меина */ clear:both; /* 3. Он не касает ни к чему с обеих сторон */ content:''; /* 1. Создаем то, что указано в кавычках, то есть ничего Пустое место */ display:block; /* 2. Это "ничто" - блочный элемент! */ } Всё. Задача выполнена) Вообще, тема флотов - очень сложна для тех, кто начинает учиться примудростям CSS. Но, считаю, что лучше начать с этого. Ведь это основы расположения элементов на странице..2 points
-
Да поняли, поняли босс..., ща погоди, метнемся по бырому и все чики-пуки сделаем, ок?2 points
-
Вот, по идее должно работать везде. .block { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); filter: progid:DXImageTransform.Microsoft.Matrix( M11=6.123233995736766e-17, M12=1, M21=-1, M22=6.123233995736766e-17, sizingMethod='auto expand'); zoom: 1; }2 points
-
Ну как... function someMegaFunction(param) { alert(1); // сработал? ок, значит попали в функцию ... ... ... ... alert(2); // сработал? ок, значит дошли до этого места ... ... ... alert(3); // сработал? ок, значит дошли до этого места } Вот как-то так... старомодно, медленно, зато я всегда так отлаживаюсь И в пень эти ваши консоли с фаербагами, хардкор рулит.1 point
-
1 point
-
могу предложить такой вариант он может не подойти для конкретных целей, но смысл других способов такой же <style> .main{ position: relative; margin: 0px auto; width: 768px; background:#bbb; } .new_main{ position: absolute; width: 100px; top: 0px; left: 100%; background:#555; } </style> <body> <div class="main"> <div class="new_main"></div> </div> </body> можно выставить эту колонку по высоте .main слева или справа и реализовать возможно в некоторых случаях будет лучше через float:left|right и position:relative;1 point
-
Radiocity, Может он имеет ввиду вертикальный ритм? http://habrahabr.ru/blogs/typography/78322/1 point
-
$(function(){...}); Тоже самое. Весь смысл этой записи в том, чтобы разместить ее сверху в <head>, а не снизу. Если хотите размещать снизу то просто пишите так: (function{ // тут код })();1 point
-
1 point
-
Большое спасибо за старания, но так не подходит. Нужно именно через toggle. Я вот чуть переделал. Картина получается странная. Заметил что если добавлять alert('Hello!');, то перед исполнением изменений с #pr - галочка всё-таки стоит!, тоесть она на долю секунды появляется, а затем исчезает! И в комментарии там другой код, с ним вообще весело: кликаем на слово привет - работает. А наоборот не работает. =\ См. http://jsfiddle.net/Pa4j8/5/ Всё-таки зачем тебе обязательно .toggle() ??1 point
-
1 point
-
1 Листик в логотипе - тоже его часть - он тоже должен быть кликабельным 2 На странице должен быть только один заголовок первого уровня. В данном случае это явно "Suspendisse felis..." 3 div с классом хелп. Если и вешать класс на этот див, то лучше support - более логичное название. Ну а разрулька с огромным лаин-хеитом это лишнее. В этот див вложи спан и на сам див задай верхний паддинг. 4 div с классом citata не нужен. Все его свойства можно перекинуть на блокквоту. 5 непонятные вещи с огромным маржином на див с классом text. Просто флотни его влево, а divlist - вправо. Естесственно, на оба дива нужна ширина. 6 Старайся вместо верхнего маржина использовать верхний паддинг на родителе. 7 Структура текста должна быть примерно такая: http://imagepost.ru/?v=nazvi-1_1.jpg И стили на h2 и p прописывать от дива. 8 див с классом лист - обычно такие вещи реализуются с помощью трех дивов, вложенных друг в друга и с бекграундами на эти дивы. <div class="list"> <div class="frame"> <div class="text"> text text text text </div> </div> </div> На первый див задается бекграудом верхняя часть твоего блока + ставишь верхний паддинг, чтобы содержимое отступало от верха как раз на высоту изображения. На второй тоже самое, но нижняя часть и соотв. нижний паддинг. ну а третий див просто заливаешь цветом, в данном случае. 9 Фишку с дивом vstavka и отрицательным маржином на футер не понял . Убрал и то, и то - стало аналогично. 10 Высоту задают только в очень редких случаях. Только если разработчик уверен на все 100, что пользователь не захочет чего-то добавить, чтодо дописать и тд. Если такой блок или оставят без изменения, или уберут вообще - только тогда. Ну вот. Это на беглый взгляд - не смотрел дизайн, просто по структуре. Пиши)1 point
-
скорее "до 16 и старше" подойдёт. кстати офтоп, а дискриминация по возрастному признаку противоречит конституции РФ?1 point
-
1 point
-
Понравились всплывающие окна с угрозами о вирусах, готов взяться за дизайн сайта-1 points
-
-1 points
-
Я тут пробую делать первые шаги в этом деле, короче. Такая задача. Есть форма и есть кнопка "отправить", нужно сделать так, чтобы кнопка "отправить" - после первого нажатия - заблокировался и форма отправилась. Ато сейчас можно нажать 100500 раз на кнопу - и столько само раз отправитца )) Ну задачу поняли?-1 points
This leaderboard is set to Kiev/GMT+03:00
-
Upcoming Events
No upcoming events found -
Сообщения форума
-
Актуальные контакты: Telegram: @Nikker_web E-Mail: tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ
-
Актуальные контакты: Telegram: @Nikker_web E-Mail: tarasevich.email@gmail.com Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ Портфолио https://www.behance.net/d4d4186e
-
Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок 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
Да, подходит. Спасибо.
-