@CSS — стилизация дневников — Дайри (бывший Diary.ru)

понедельник, 16 февраля 2009

11:48

все записи пользователя в сообществе Касатик

Верю в сказку и волшебство....

Здрям!! Есть такой вопросик: что можно сделать с той частью меню, где название днева, картинка и имя?? И какие к ним id? Если по этому поводу есть что то в сообществе, то киньте ссылку, я не нашла. Зарание спасиба!! )

@темы: меню

URL

воскресенье, 15 февраля 2009

20:41

все записи пользователя в сообществе Atsu chan

"Я счастлив.. потому что я дышу.. не существует такого слова как несчастье, пока человек не перестал дышать" (с) Ким Хичоль

Как сделать так, что бы список с Темами в меню был всегда закрытым? и при нажатие на него открывался только на новой странице со всеми темами.
Или как зафиксировать количество тем, в смысле... что бы при нажатие на него... показывали только 3-4 самые популярные темы.?

*извините, если бы вопрос. не нашла.*

URL

суббота, 14 февраля 2009

18:47

все записи пользователя в сообществе God in the wires

Come into Wired as soon as you can.

Проблема очень распространенная, я не знаю, придумали ли уже как с ней бороться, но если кто-то знает, очень прошу, помогите.
1) Тег MORE работает как в ЖЖ, т е по клику на "читать дальше" переправляет на урл записи. У меня есть буквица, однако проблема появилась ещё до её установки.
2) Хочется, чтобы буквица отображалась только в постах. Это уже где-то объясняли, но я, к сожалению, мало что поняла.
код
читать дальше

@темы: текст, diaryCSS

URL

пятница, 13 февраля 2009

10:25

все записи пользователя в сообществе Lennie.

фанат гета и паштета

Доброго дня.
У меня тут два небольших, надеюсь, вопроса.
1) Возможно ли как-то сократить длину эпиграфа? А то в нем имеется только одна строчка (в more, правда), а места занимает слишком много:

2) Неужели ради буквицы придется пожертвовать нормальным отображением тэга MORE? Делаю себе буквицу, как сказано тут, но тогда в избранном упорно не раскрывается кат, приходится переходить на url записи, чтобы увидеть, что ж там было спрятано.
Не смертельно, но очень неудобно. Когда убираю коды из настроек, все отображается нормально. В чем подвох?

@темы: текст, эпиграф

URL

05:45

все записи пользователя в сообществе Mai Orange

за маской реальности иллюзия совершенства

Доброй ночи. Я впервые обращаюсь, но помогите пожалуйста, если кто может. Суть в том, что мое меню уходит под низ самого блока записей

но это происходит только тогда, когда я его просматриваю пробовала стандартные варианты диза без CSS - происходит тоже самое оО, меню уходит вниз , но при редактировании, коментировании и предпросмотре все просто замечательно и на своем месте о__О...
при предпросмотре записи:

CSS коды

@темы: меню

URL

четверг, 12 февраля 2009

19:11

все записи пользователя в сообществе Инстинктивный доброволец

кто, если не я?©

подскажите, пожалуйста...
пишу вот так #extratop {background: # no-repeat; width: 700 px; height: 427px; border: 1px solid #07040f} а картинки нет. пространство под неё есть, а картинки нет.

URL

13:46

Позиционирование фотового изображения

все записи пользователя в сообществе тестовый дневник

Здравствуйте!При установке картинки на фон возникла проблема.
Суть в следующем: мне нужно, что бы положение картинки было 0 px снизу и 0 px слева, а сверху и справа - произвольно, в зависимости от разрешения экрана. Задавать конкретные точки положения картинки по всем четырем сторонам я не хочу, нужно что бы она просто прилипала в нижнем левом углу.
Код вот:
body { background: #d74b0e url('/userdir/1/0/5/9/1059285/37886363.jpg') no-repeat; width:1024 px; height: 768 px; position:absolute; bottom: 0px; left:0 px; background-attachment: fixed}

Когда я пишу вот так: bottom: 0px; left:0 px; картинка мало того, что и не думает прилипать к низу экрана, она еще и стопорит page-t в самом нижнем положении, как буд-то прокрутили до низу.
Когда пишу top: 0px; left:0 px; все прокручивается нормально, но (!) картинка прилипает (естественно) к верху экрана, а мне этого не нужно.

Подскажите, пожалуйста, как мне быть.

UPD: решение url('/userdir/бла-бла.jpg')no-repeat left bottom;

@темы: фоновые картинки, основные блоки

URL

среда, 11 февраля 2009

17:42

все записи пользователя в сообществе Sightless

Жить ой. Но да. ©

Здравствуйте. Хотелось бы спросить вот о чем: я прописываю для .left #wrapper тот же цвет, что и стоит на фоне блоков, чтобы меню продолжалось с основным блоком записей. Но из-за этого у меня не получается установить картинку в экстратоп, в которой есть прозрачные элементы (PNG). Скажите, как конкретно для экстратопа это свойство отменить?
Сам код
Заранее благодарю )

@темы: меню, основные блоки, Дизайн

URL

14:24

все записи пользователя в сообществе Елена-турк

perverted beaver

Помогите, пожалуйста. Так и не смогла найти, как можно увеличить отступ между блоком меню и основным блоком. Мне нужно, чтобы блок меню был с самого краю слева

~~картинка~~

~~код~~
~~#side {width:180px !important; margin:0 !important}~~
~~#page-c {width:660px !important; padding:0 !important; margin:0 !important}~~
~~#page-t {margin:0 !important;}~~

UPD: проблема решена самостоятельно.

@темы: меню, отступы, основные блоки

URL

вторник, 10 февраля 2009

19:49

все записи пользователя в сообществе она была его тенью.

В твоей жизни может быть всё. Главное знать, где и когда это всё можно поймать.(с)

Всем доброго времени суток.
Не обзывайте меня и не бейте, потому что у меня тупая просьба =(
Я решила себе сделать дизайн, взяла его в готовых дизайнах. Там он достаточно сложный, но оно стоит того.
Короче, я не понимаю, почему у меня вылежают какие-то дурацкие белые полосы под экстратопом и между постами? Я когда закачиваю в БИ, то картинки туда кидаю в формате .png, а в БИ они становяться почему-то формата .jpg . Может быть эти белые полосы из-за этого? И как убрать эти полосы?
Это так, как у меня:
Тык
А вот как должно быть:

Тык

Прошу помочь. Буду очень благодарна =)
С уважением, Варвара.

@темы: эпиграф, отступы, основные блоки, Дизайн

URL

08:43

Для начинающих и продвинутых дайри-дизайнеров.

все записи пользователя в сообществе Roldo

Совершенству эволюция не нужна.

В эпиграфе указаны средства, с помощью которых можно просматривать страницы с точки зрения разработчика - увидеть структуру ваших страниц, узнать какие свойства прописаны для каждого элемента дневника (ну и любого другого сайта) и какие имена у этих элементов. Такие средства есть для FireFox (Firebug) и IE (IE development toolbar). Но у многих из вас используется Опера, а для нее тоже есть похожая штука, правда посложнее, чем используется в ИЕ. Это панель, которая заменяет стандартную панель "Вид" Оперы, поэтому устанавливать ее нужно с четкой уверенностью, что она вам нужна - интерфейс управления отображением сайтов станет иным и непривычным.
Качаем отсюда: operawiki.info/WebDevToolbar
Для этого войдите на сайт из Оперы 8 или 9, сначала нажмите на ссылку web developer menu для вашей версии Оперы, проследуйте инструкциям по установке. Меню установится в оперу и включится автоматически.
Затем выберите ссылку Web Developer Toolbar for Opera 8-9, и точно также автоматически установится сама панель.
Теперь смотрим:
Reset page - перезагрузить страницу
Display - смена настроек отображения на пользовательские.
Меню Forms - это специфические настройки управления формами на странице. С помощью него можно производить групповые операции с управляющими элементами, но нам это меню в сущности не нужно, поэтому разберитесь с ним сами. Все описание дано на странице для скачивания панельки, требуется тлоько знание английского.
Меню Images - старые настройки отображение страницы с рисунками или без + групповые операции с картинками на странице. Кстати довольно полезные.
Page Info - главное меню, нужное нам:
- DOM/CSS inspector выводит отдельную страницу, на которой страница, рассматриваемая вами разобрана "по винтикам" в виде дерева из элементов. Если вы знаете HTML, то легко представите основной элемент страницы, из которого "произрастают" все остальные, а из них, в свою очередь , дочерние элементы. Бегая по ссылкам, вы будете открывать дочерние элементы от главного и просматривать их свойства и названия. Также показаны все связанные с элементом файлы и страницы.
- Mouseover DOM inspector похож на IE development: при наведении мышки на элемент страницы, в отдельном окошке появляются все его свойства, в т.ч. и название, что зачастую нужно нам больше всего. Кроме того, выделенный элемент подсвечивается, что позволяет увидеть его границы и сообразить, как прописаны его свойства, особенно margin или padding. Если наводить курсор на содержимое вспомогательного окошка с инфомрацией об элементах, то те блоки, на которые наведен курсор, также подсвечиваются на странице.
- Javasсript obect inspector - то же самое для элементов, созданных с использованием языка Ява. Нам это без надобности, но для дизайнера вне дайри пригодится.
- See page statistics - отображает в отдельном окошке подробную статистику страницы - число элементов, вес ее кода в байтах (главная страница моего дневника весит аж 280 килобайт) и прочее.
- Также интересная вещь - See internal/external links - отображает разными цветами ссылки на внешние ресурсы, внутренние ресурсы или элементы страницы.
- See Element nesting - показывает вложенность элементов в виде псевдотрехмерных слоев, отображая их свойства. Видно, какой элемент находится внутри какого и какой лежит "ниже" или выше по иерархии.
- ОЧЕНЬ удобная штука See Element dimensions - отображает все размеры элементов на дневнике. Надо только ввести тип элемента, например div. О div и осталньых типах читаем на htmlbook.ru
- List frames используется для фреймовой структуры, она тут не используется.
Смотрим дальше меню Utils.
- Remove Child elements - убирает элементы со страницы по клику. Можем получить вид страницы, как будто этих элементов вовсе там нет. Нажав ESC получаем возможность использовать такую страницу физически. Это позволяет продемонстировать возможности альтернативной работы странички, и служит больше для разработчиков сайтов.
- Convert Links to footnote делает ссылки "разборными", представляющими собой title (подпись) и собственно физическую ссылку вида "http://.."
- Reveal destination... - похожая история.
- Simple calculator - простой калькулятор, набираете выражение (45*35) и жмете ОК для ответа
- Ascii table выводит таблицу служебных символов с их десятичным и шестнадцатеричным кодом.
- Character map выводит таблицу всех символов имеющихся у вас шрифтов.
Ну и меню Validate позволяет произвести разбор ваших кодов с указанием ошибок. Для нас можно взять CSS валидацию, если мы сомневаемся в правильности кода. Но определенные ошибки существуют там и вне нашего вмешательства, поэтому изучите их, чтобы не принимать во внимание, когда будете анализировать свой собственный пользовательский код!
Меню Specs может показать вам краткую справку по программированию в html или CSS, а также другие справки по веб.
Меню Page Source содержит старые ссылки на код страницы, а также можно просмотреть хтмл-элементы в виде дерева (рекомендуется), внешние ксс-файлы с кодами в CSS или скриптами. Внимательно изучите это меню, оно полезное.
Меню id меняет айди вашего браузера на другие, когда информация о нем передается в интернет.
Ну и наконец InFF и InIE открывает вашу страницу в браузерах ФайрФокс и ИЕ соответственно, если они у вас установлены.
Пользуйтесь)
-

@темы: Учеба

URL

понедельник, 09 февраля 2009