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

среда, 23 ноября 2016

01:54

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

Так пускай наступает холодным рассветом на нас новый день.

Подскажите, плиз, как сделать фон со ссылками внизу прозрачным?
Я уже что только ни перепробовал. Всё в дневнике прозрачное, кроме этого.

@темы: меню, diaryCSS

URL

пятница, 11 ноября 2016

14:41

Перестали работать ссылки в меню

все записи пользователя в сообществе Лирэн

Scientia potentia est.

Я только учусь, начала верстать, и у меня пара вопросов.
1. Почему у меня видны ссылки меню, но они не работают (и не ведут себя, как ссылки)? Как я смогла их поломать этим кодом?
2. Я выбрала оптимальный способ выровнять фон записей или надо было иначе?

старый код и скриншот

  #extratop{background: url('/userdir/3/0/8/1/308169/84579233.png') no-repeat; width:980px; height:281px; position:relative; }
 #wrapper {background: url('/userdir/3/0/8/1/308169/84579050.jpg')}
 #extrabottom {background: url('/userdir/3/0/8/1/308169/84579095.png') no-repeat; width:980px; height:269px; position:relative; }
 #side {z-index:599}
 #page-c {background-image: url("/userdir/3/0/8/1/308169/84579089.png"); background-repeat: repeat-y; position: relative; left:-264px; width:980px !important; padding:0 !important; margin: 0!important;}

UPD.
Вот этот код - весь код, который я прописала, других элементов еще нет. Я поняла, что position: absolute #page-c приводит к тому, что меню перестает быть активным. Если изменить позиционирование на relative, то фон сдвигается вправо, если его выравнивать - меню опять не работает. Z-index меню проблему не решает.

запись создана: 08.11.2016 в 22:44

@темы: меню, отступы, фоновые картинки, Учеба

URL

воскресенье, 06 ноября 2016

16:16

Фото сдвигается вправо.

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

Правда Вас освободит, но вначале она Вас уничтожит

Здравствуйте.
Я в CSS почти полный ноль, не знаю даже, как собственный дизайн собрал.
У меня стало уезжать фото, которое под названием дневника в экстратопе. Раньше было на месте, а теперь сдвинулось вправо. Пересматривал свой код, но ничего не понял.
Есть ли какой-нибудь код, которым можно это фото загнать обратно на свое место?

скрин

Надеюсь кто-нибудь подскажет.
Заранее спасибо!

@темы: отступы, diaryCSS

URL

четверг, 03 ноября 2016

09:51

flex

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

Нет, я не безумец, мне и так хорошо(с) Репутация – это то, что о тебе знают другие. А честь – это то, что знаешь о себе ты сам.(с)

Кто-нибудь уже сталкивался с масштабным использованием flex в дайри-верстке. Использую его пока исключительно локально (скажем, для верстки эпиграфов), там все радует. А вот как оно работает, если работает, скажем на уровне сетки страницы? По идее все должно быть ок, а вот как на практике?

URL

среда, 02 ноября 2016

19:15

@media

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

Добрый день! Пытаюсь прописать диз для мобильного вида, но

@media only screen and (max-width: 768px)

работает только для узких экранов с компьютера, мобильные экраны не реагируют. В чём может быть дело? Дайри вообще с этой фичей дружат или как?

@темы: diaryCSS

URL

воскресенье, 02 октября 2016

16:19

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

Победа! Честь! Судьба! Баранина!

Добрый день!

Пытаюсь задать фон дневнику картинкой. Код:

body {background: url('/userdir/2/9/9/5/2995931/84451294.jpg') top center no-repeat fixed;}

Но при сохранении url заменяется на #. Наверное, дело в том, что изображение загружено не в мою БИ, а в БИ тестового дневника. Но тогда возникает вопрос, почему у меня работает дизайн, установленный из сообщества дизайнов - там фоновое изображение загружено тоже не в мою БИ.

Заранее спасибо за ответ.

@темы: фоновые картинки, diaryCSS

URL

четверг, 29 сентября 2016

19:20

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

Начинаю потихоньку осваивать платные дизайны, в процессе возник вопрос: можно ли как-то увеличить отступы между блоком "аватарка-подпись" и "содержимое записи/комментария"? Хочу обвести аватары рамочкой, но тогда между картинкой и текстом получается слишком маленькое расстояние, что не очень удобно для чтения.

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

URL

среда, 28 сентября 2016

22:40

Изображения в посте

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

Fen'Harel enansal | В девичестве Shep.

Доброго времени суток!

Поиск по сообществу не работает, поэтому спрошу так: можно ли приказать изображениям в посте перестать изменять размер?) Ширину контейнера менять не хочу, а самовольно уменьшающиеся картинки немного раздражают. В идеале было бы прописать дефолтное разрешение, к которому будут приходить все изображения, которые оказываются шире контейнера. Дизайн собирала сто лет назад, в упор не понимаю, куда ткнуться.

Код.

#add_block1 { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background: url('/userdir/1/0/5/9/105999/83097103.jpg') 0 100% no-repeat; z-index: -10;}
 #add_block2 { position: fixed; width: 100%; height: 100%; top: 0px; left: 370px; background: url('/userdir/1/0/5/9/105999/83097104.jpg') 0 100% no-repeat; z-index: -10;}
 .block_design {background-attachment:fixed; padding: 0 !important; }
 body{background-attachment:fixed !important; margin:0; padding:0; }
 #extratop { height: 470px; width: 740px; margin: 15px 0px 10px 240px !important; padding: 0px 0px !important; background:#b4aab1 url('/userdir/1/0/5/9/105999/84087021.jpg') 0% 0% repeat-y !important; }
 #wrapper{ width: 980px !important; margin: 0 auto !important; padding: 0 !important; position:relative !important; top: 0px; bottom: 0px !important; }
 #img { max-width:1000px !important; }
 #page-t {margin: 0px 0px 0px 0px !important; padding: 10px 0px 10px 15px !important;}
 .singlePost, .singleComment { background: #b4aab1 !important ; margin: 20px 0px 20px 0px !important; padding: 15px 15px !important; position:relative; }
 .postContent { background: #b4aab1 !important; padding: 25px 15px !important; margin: 20px 1px 20px 1px; border: 1px solid #72656e !important; border-top: 1px solid #72656e !important;}
 .authorName { background: #72656e !important; padding: 1px 15px 1px 15px !important; margin: 1px 1px 1px 1px; }
 .postLinksBackg { text-align: center !important ; background: #72656e !important; text-transform:lowercase; font: 13px 'verdana' !important; padding: 5px 25px !important; margin: 5px 1px 0px 1px; }
 .prevnext { text-align: right !important ;}
 .prevnext { text-align: right !important ;}
 #epigraph .header { display:none !important;}
 #epigraph { border: none !important; margin: 0px 0px 0px 0px !important; padding: 0px 0px 0px 0px !important; }
 #post0 {background: none !important; padding: 5px 10px 10px 10px !important; margin: 0px 0px 0px 0px !important; }
 .singleComment .postTitle { right: 12px; text-transform: lowercase; font: bold 11px 'verdana' !important; color:#ffffff !important; position:absolute !important; margin: 0px 2px 0px 2px !important; }
 #new_post_title, #addCommentArea_title, #commentsArea_title { text-transform:uppercase; font: bold 15px 'Book antiqua' !important; color: #ffffff !important; margin: 8px 0px 0px 0px !important; text-align:center !important; padding: 8px 10px 8px 10px !important;}
 {----------------------}
 #formcontainer {background: #b4aab1 !important; border:none !important;}
 #msg_form {padding: 15px !important; background:#b4aab1 !important; margin: 0px 0px 0px 0px !important;}
 #content { background:#b4aab1 !important; margin: 0px 0px 0px 0px !important; padding: 10px 30px 10px 30px !important ;}
 #JournalLinks #page-t {background:#b4aab1 !important; padding: 10px 15px !important; margin: 0px 20px 0px 20px !important;}
 #JournalLinks .header { background: #b4aab1 !important; border:none !important;}
 {-------------menu---------------}
 .menuSection {text-align: right !important; }
 #side {position: absolute; top: -3px; left: 15px; right: 0px; display: block; width:210px !important; height: 455px; font: 12px 'verdana' !important; padding: 15px 0px 3px 0px !important; color: #b4aab1; background:#b4aab1 !important; text-transform: uppercase; }
 .menuSection {margin: -12px 0px 0px 0px !important; color: #b4aab1 !important;}
 #thisDiaryLinks li {padding: 3px 5px !important; margin: 5px 0px !important; background: #72656e !important; }
 #thisDiaryOwner li {padding: 3px 5px !important; margin: 5px 0px !important; background: #72656e !important;}
 #globalLinks li {padding: 3px 5px !important; margin: 5px 0px !important; background: #72656e !important;}
 #myDiaryLinks li { padding: 3px 5px !important; margin: 5px 0px !important;background: #72656e !important;}
 #myDiaryLinks li:hover, #thisDiaryLinks li:hover , #thisDiaryOwner li:hover , #globalLinks li:hover {background: #d0c7cc !important; }
 #myDiaryLinks { top: 35px; left: 0px; background: #b4aab1 !important; }
 #globalLinks {background: #b4aab1 !important; }
 #thisDiaryOwner {background: #b4aab1 !important; }
 #thisDiaryLinks {background: #b4aab1 !important; }
 #side a {color: #d0c7cc; }
 #side a:hover {color: #color: #b4aab1 !important;}
 #postsCalendar, #rssLink, #upInChart, #authorAlbum, #albumLink, #photolibLink, #allDiaryLink, #pchListLink, #communityCatalogueLink, #myCommunitiesLink, #myCommunityLink, #randomDiaryLink, #diarySpiritLink, #diarySupportLink, #faqLink, #lastComments, #pchs, #YaSearch, #thisDiaryPhoto, #myNotepadLink, #iAmQuit, #Stats, #top_randomlink, #top_spiritlink, #topNav, #myLinks, #lastComments, .order_button {display:none !important;}
 #side h1 {display:none !important;}
 #side h1 a {display:none !important; }
 #side h1 a:hover {display:none !important;}
 #authorName {display:none !important;}
 #TagsList { position: absolute; top: 20px; right: -300px; background:#72656e !important; text-transform: lowercase; width: 250px !important; margin-top: 5px !important; }
 #TagsList li:before { content: none !important; }
 #TagsList li {padding: 0px 10px 5px 0px !important; margin: 0px 10px 0px 0px !important; border: none !important; }
 #myLinks li:before { content: none !important; }
 {-------------------------}
 .postActionLinks {margin: 0px -30px 0px 0px !important; position: absolute; right: 0px; width: 19px; top: 0px; }
 .postActionLinks li {margin: 3px 0px 0px 0px !important;}
 .singleComment .postActionLinks {margin: 0px -40px 0px 0px !important; position: absolute; right: 0px; width: 15px; top: 0px; }
 .urlLink a {display: block; background: url('/userdir/1/0/5/9/105999/65423042.png') 0px 0px no-repeat; width: 20px; height: 20px; overflow: hidden; line-height: 50px; margin-top: 0px !important;}
 {---------------- header ----------------------}
 #postsArea .header { background: #72656e !important; margin: 1px 1px 0px 1px !important; padding: 5px 0px 10px 5px !important; text-align: center !important;}
 #postsArea .postDate {position: absolute; top: -25px; left: -5px; text-align:left !important; text-transform: uppercase; font: 11px 'Book antiqua' !important; margin: 2px 2px 0px 0px !important;color: #d0c7cc !important;}
 #postsArea .header h2{ font: 20px 'Times New Roman' !important; padding: 0px 0px 0px 10px !important; ; color: #d0c7cc !important; text-align: center !important; text-shadow: 3px 3px 3px #4a3f47 !important;}
 #postsArea .postTitle span{ position: absolute; top: 25px; left: 28px; color: #d0c7cc !important;}
 #JournalComments .authorName { background: #72656e !important; padding: 5px 15px 10px 15px !important; margin: 5px 1px 0px 1px; border-top: 1px solid #72656e !important; border-bottom: 1px solid #72656e !important;}
 .communityName { background: #72656e !important; padding: 0px 15px !important; margin: 1px 1px 0px 1px;}
 {----------------------link---------------------}
 a:link, a:visited {text-shadow: 0px 0px 5px #4a3f47 !important; text-decoration:none !important;}
 a:hover, a:active {color: #fff !important; }
 {--------------------tags----------------------}
 .tags_ul_all { margin: 50px 20px 0px 20px !important; }
 .tags_ul_all a { margin: 0px 10px 0px 0px !important;}
 .tags_ul_all span { margin: 0px -20px 0px 0px !important; }
 .voting img { height: 0px !important; border-top: solid 5px #7eb3dc;}
 .paragraph img { max-width: 650px !important; }
 .postActionLinks { padding: 0px 0px 0px 30px !important ; }
 p.atTag, p.atMusic, p.atMood {font: 11px 'verdana' !important; color: #65505b !important; margin: 1px 0px 0px 0px !important;}
 .atTag a, atMusic a, .atMood a {color: #dad1d5 !important; }
 .atTag a:hover, atMusic a:hover, .atMood a:hover {color: #fff !important;}
 {----------------------------------------------}
 span.quote_text {font-style:normal; display: block; margin: 5px;padding: 5px; border:1px dotted #72656e; font-size: 97%; background: #c3b9c0; }
 .postTitle {text-shadow: 2px 2px 10px #a1a1a1; text-align:center}
 .avatar img { min-width: 100px !important; max-width: 120px !important; -webkit-box-shadow: 2px 2px 3px #4a3f47; -moz-box-shadow: 2px 2px 3px #4a3f47; box-shadow: 2px 2px 3px #4a3f47; }
 .commentAuthor {margin: 0px 0px -5px -10px !important; width:130px; padding: 10px 1px 1px 10px !important; }
 #JournalComments .paragraph, #JournalFavorite .paragraph, #JournalQuote .paragraph { padding: 10px 0px 0px 0px !important ; z-index: 3 !important; margin-top: 0px;}
 .sign { color: #7c636f !important; font: 11px 'verdana' !important; width: 105px !important; text-align: justify !important;}
 #message, textarea#message, input.text, #trspisok textarea, #close_text, #cc, #msgWin, #btSubmit { border:1px solid #72656e !important; background: #b4aab1 !important; margin: 10px 20px 10px 0px !important;}
 #but, #codebuttons, #shsmile { border:1px solid #72656e !important; background: #b4aab1 !important; }
 {---------------------page----------------------}
 #pageBar {margin: 20px 0px 10px 0px !important; background: #72656e !important; padding: 20px 10px !important; position:relative;}
 .pages_str td {width: 440px !important; }
 .pages_str a {background: #b4aab1 !important; padding: 7px 15px !important; text-transform: lowercase; text-decoration: none; font: bold 11px Tahoma !important; color: #dad1d5;}
 .pageBar td a { text-decoration: none; font: bold 11px Tahoma !important; background: #b4aab1; padding: 7px 15px !important; }
 .pageBar td strong { color: #fff; text-decoration: none; font: bold 13px Tahoma !important; background: #b4aab1; padding: 5px 15px 6px 15px !important;}

Решено.

@темы: diaryCSS, основные блоки

URL

среда, 21 сентября 2016

19:31

все записи пользователя в сообществе один/из|рен

темные ебанации

можно ли сделать так, что бы пункт меню "добавить в избранное" был виден не только другим пользователям, но и владельцу дневника тоже? просто прописал отдельно каждый пункт в меню и на месте добавить в избранное у меня отображается соответственно ничего

а перекраивать меню полностью уже не хочется.

@темы: меню, diaryCSS

URL

четверг, 15 сентября 2016

23:31

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

Ratnisa

Не слишком шарю, поэтому и вопрос тупой, и звучит соответствующе.
Сделала себе дизайн дневника, но основные блоки (это в которых записи) идут полосами.
вот так
Что с этим делать, подскажите пожалуйста)

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

URL

суббота, 10 сентября 2016

12:11

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

Осталась только любовь и совсем немножечко веры // Зажженному положено гореть

Добрый день!
Пилю дизайн. Хочу использовать нестандартные шрифты с подгрузкой с google fonts. Но, похоже, дайри вырезают конструкцию @import. Есть ли еще какой-то способ?

@темы: текст, Дизайн

URL

суббота, 20 августа 2016

19:53

"Уполз" блок меню

все записи пользователя в сообществе Лан Мао

пизденящий душу леденец...

Добрый день!

На проверенном дизайне внезапно блог меню "уполз" вниз. Причем некорректно он отображается только когда захожу на свой дневник, через избранное все на месте. Подскажите что могло случиться?

кусочек кода с меню

@темы: меню

URL

четверг, 07 июля 2016

17:21

все записи пользователя в сообществе Грач

Просто добавь в это небо чуть блеска.

Здравствуйте!
Как в меню добавить свои ссылки? Под катом картинка желаемого. Дизайн блочный, навигационная панель наверху. Порядок ссылок в ряду не важен.
картинка

Спасибо!

@темы: меню

URL

пятница, 01 июля 2016

23:00

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

If you're not angry, you're not paying attention

Добрый вечер!
Объясните, пожалуйста, что я делаю не так.
читать дальше

UPD. Всё, я разобралась сама! :ura:

@темы: меню, diaryCSS

URL

вторник, 14 июня 2016

20:26

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

Добрый вечер. Подскажите, как сделать, чтобы в комментариях не показывались аватары и подписи?

@темы: основные блоки

URL

понедельник, 06 июня 2016

20:02

почему может не работать margin?

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

код простейший, а обтекание текстом не срабатывает. ни margin, ни shape-outside.

что это может быть?

@темы: отступы

URL

четверг, 02 июня 2016

22:37

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

[Весь мир - большой толковый словарь, а я в нем - codex seraphinianus]

Всем приятного времени суток! Знатоки css не подскажите что запилить в код, что бы в окне комментариев и окне нового поста текст автоматически переходил на новую строчку дойдя до границы, а не уходил в бесконечность пока сама не переведешь? Буду вам очень благодарна :heart:

___
Решено. Ошибка в кривом до неприличия коде.

@темы: текст

URL

12:34

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

Привет, в css-е я новичок, и я нуждаюсь в помощи.
Как мне подвинуть .postDate так, чтобы он был над .header'ом и справа? В оригинале он и над хэдером, и справа, но из-за того, что блок занимает всю ширину, бэкрагунд-калор заливает очень широкую полосу, а мне хотелось бы, что он заливал ровно столько, сколько требуется. В изображении специально включила в хэдере рамку, чтобы поняли мою боль ><.

URL

воскресенье, 22 мая 2016

13:12

Дополнительные блоки

все записи пользователя в сообществе Ветер~

supersonic

Здравствуйте. Есть вопрос по блокам в CSS, перерыла сообщество, но ответ так и не нашла.

Как (и возможно ли это вообще) на дайри реализовать кастомные боковые блоки, в которые можно было бы помещать текст/картинки/ссылки/видео. Что-то похожее на эпиграф с измененным расположением, но в количестве 2-3 штук.

@темы: меню, diaryCSS, платный сервис

URL

вторник, 26 апреля 2016

00:50

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

Moving on. Never stopping. Always changing.

Здравствуйте.

Подскажите, пожалуйста, как можно ограничить размер рисунков, вставляемых тэгом:

<img src="огромный_рисунок.jpg">

Хочу, чтобы рисунки не выходили за рамки моего фона, а масштабировались (wrapper ограничен по ширине до 950 px, минус ширина меню).
Вариант со скроллбаром не нравится.

Это каким-то образом реализовано в платном дизайне "Water Color", но пока не могу понять, как именно.

Пытаюсь прописать в CSS вот такую конструкцию:

#div_img {max-width: 600px !important;}

Но результата это не дает :-(

Что я делаю не так?

РЕШЕНО.

@темы: diaryCSS, платный сервис, Дизайн

URL


Запомнить