@CSS — стилизация дневников — @дневники: асоциальная сеть

четверг, 22 августа 2013

22:46

Вынос меню под экстратоп

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

sometimes the hardest thing and the right thing are the same

В общем, уверена на 100%, что такой вопрос задавался, и не раз, но мои способности поиска оставляют желать лучшего.

Хочу сделать меню между записями и экстратопом в три колонки.
Насколько поняла, нужно привязывать отдельные пункты к координатам, так? Можете скинуть ссылку с как можно более подробным описанием того, как это делается.
Буду премного благодарна.

@темы: меню

URL

00:18

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

Квинтэссенция хаоса.

И вновь приветствую)

По ходу дизайна столкнулась со следующим: нужно, чтобы колонка меню была строго по левому краю монитора, но траббл в том, что при разном разрешении оно и выглядит по-разному. Например, если на моём 1280х1028 всё ок, то у тех, у кого оно больше 1400рх по большей стороне, меню немного наезжает на page-c. И наоборот — у кого оно ~1000х700, уходит за левый край так, что его не видно вообще.

Раньше стояло так:
#side{width:165px !important; position:fixed; padding-right: 5px !important; margin-left: -740px !important;}

Потом я прибила его флоатом, меню сдвинулось к блоку записей, но из-за этого там получился довольно значительный кусок пустого пространства с левой стороны:
side{width:165px !important; position:fixed; float: left!important; padding-right: 5px !important;}

Есть ли способ прописать так, чтобы оно масштабировалось в зависимости от размера монитора и не уезжало дальше положенного?

Скрины и весь код могу показать только в умыле — диз конкурсный, раньше времени его светить нельзя.

@темы: меню

URL

воскресенье, 18 августа 2013

21:32

Не могу понять, в чём проблема

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

"Быть собою - почти искусство" (с) Чароит

Создала меню, в котором надписи сделаны картинками. Код следующий:

 #myDraftLink {background: url('/userdir/3/1/4/4/3144244/78558043.png') no-repeat; padding: 0 0 10px 0px !important;}
 #myDraftLink a, #myDraftLink a:hover {color: transparent !important;}
 #umailLink {background: url('/userdir/3/1/4/4/3144244/78548690.png') no-repeat; padding: 0 0 10px 6px !important;}
 #umailLink a, #umailLink a:hover {color: transparent !important;}

В результате получается такой вид:

Никак не пойму: почему у черновиков цифра показывается, а у у-мейла - невидимая.

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

URL

суббота, 17 августа 2013

22:24

help me, please!

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

Когда наступает депрессия или смятение, попробуй лечь на спину на полу и подними лапы вверх. Иногда мир выглядит лучше вверх ногами.

1. Никак не убрать расстояние между верхом страницы и оболочкой дневника.
margin-top: 0px не помогает, даже если ставить !important. то ли я не туда это пишу (хотя вряд ли), то ли там конфликт в коде.

2. Кнопка правки эпиграфа не активна. Как сделать её активной?

Код:

#wrapper{width:860px;min-width:860px; padding-top: 5px !important; background:url('/userdir/1/6/1/9/1619707/79221197.jpg'); left:50%; margin-left:-430px; margin-top: 0px !important; position: absolute;}
 body {background:url('/userdir/1/6/1/9/1619707/79221202.jpg') repeat; margin-top: 0px !important;}
 #side{width:180px; background: #f9f9f9; margin: 5px 0px 10px 10px !important; -moz-border-radius: 10px; border-radius: 10px; border-style: solid; border-width:2px; border-color:#e5835e;}
 .left #page-c {margin-left:-195px;}
 .left #page-t {margin-left:195px;}
 #page-t {background: #f9f9f9; width:650px; margin: 5px 10px 10px 197px !important; -moz-border-radius: 10px; border-radius: 10px; border-style: solid; border-width:2px; border-color:#e5835e;}
 #authorFav, #rssLink, #upInChart, #albumLink, #communityCatalogueLink, #diarySpiritLink, #faqLink, #lastComments, #pchs, #topNav, #myAccountLink {display:none !important;}
 .postTitle {font: bold 16px Georgia; background: #e4f2f0; margin-bottom: 15px !important; padding: 5px 5px 5px 5px!important; text-align : center; text-shadow : #848484 1px 1px 1px; }
 .postTitle {background: #e5835e !important; }
 #post0 .postTitle {background: transparent !important; }
 #epigraph, #post0 {padding: 3px !important; margin-top: 3px !important;}
 A:HOVER{color: #da5022 !important; text-decoration: none;}
 .postDate{font-style:italic !important; font-size:12px !important;}
 .singlePost {position: relative; padding: 5px 0px 0px 0px !important; }
 .quote_text {background:#f8e0d4 !important; padding: 12px; display:block;}
 #side h1 a{font: bold 20px Georgia;}
 #authorName {font: italic 13px Georgia !important;}
 .avatar img, .avatarNew img {border: 2px solid #e5835e;}
  img{max-width: 640px;}

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

URL

19:03

Темы записей

все записи пользователя в сообществе Arthur, darling

в слове «dreams» всегда звучит твоё тёплое имя. [c]

Доброго времени суток. Не нашел решения проблемы в сообществе (ткните в пост, пожалуйста, если плохо смотрел).

В меню, сбоку, отображается всего 7 тем (скриншот), хотя должно быть 9 (не хватает темы "колоризация" и "скриншоты"), причем, когда в постах нажимаю на них, выкидывает на эту или на эту страницу. Где и что подправить?.. Кэш чистил, темы удалял в "Настройки - - > Темы записей", у остальных отображается так же.

Код:

 .block_design {background: #000000; padding: 0 !important; }
 #wrapper{ background: url('/userdir/7/9/5/8/795849/79216098.jpg'); min-width: 980px !important; width: 980px; margin-top: 90px !important; margin-bottom: 20px !important; padding-top: 0px !important; border: 2px solid #ffffff; }
 #extratop { height: 0px; width: 0px; margin-top: 0px !important; padding-top: 0px !important; }
 {----------------------------------------------- menu ----------------------------------------------------}
 #side {width: 180px; margin: 9px 0 0 10px !important; position: relative; text-align: center; text-transform: uppercase; color: #000000 !important; font: 12px Helvetica !important;}
 #side a { color: #000000;}
 #side h1 A { position: absolute; top: -70px; left: -10px; width: 700px; font: 24px Impact !important; text-align: left; z-index:10 !important; color: #5a0000 !important; text-shadow: 0px 1px 1px #000000; filter: dropshadow(color=#000000, offx=0, offy=1); text-transform: lowercase;}
 #thisDiaryInfo, .menuSection li, #Stats { background: url('/userdir/7/9/5/8/795849/79215763.jpg'); border: 1px solid #000000; width: 150px !important;}
 .menuSection li {padding: 5px 0px 5px 0px !important; margin-top: 5px !important; }
 #thisDiaryInfo {padding: 10px 0px 10px 0px !important; margin: 5px 0 0 5px !important; }
 #faqLink {display: none;}
 #diarySupportLink {display: none;}
 #upInChart {display: none;}
 #myQuotLink {display: none;}
 #diarySpiritLin {display: none;}
 #myCommunitiesLink {display: none;}
 #randomDiaryLink {display: none;}
 #communityCatalogueLink {display: none;}
 #allDiaryLink {display: none;}
 #mySFavLink {display: none;}
 #mainpageLink {display: none;}
 #rssLink {display: none;}
 #iAmQuit {display: none;}
 #diarySpiritLink {display: none;}
 #myAccountLink {display:none;}
 #YaSearch {display:none;}
 #favListLink {display: none;}
 #pchListLink {display: none;}
 #authorAlbum {display: none;}
 #albumLink {display: none;}
 #myProfileLink {display: none;}
 #authorQuot {display: none;}
 #notepad {display: none;}
 #TagsList {display:block !important;visibility:visible !important; }
 #TagsList { background: none !important; margin: 0 !important; text-align: left; text-transform: lowercase; }
 #TagsList li { background: none !important; border: none !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; margin-top: 1px !important; padding: 0 !important; width:130px !important;}
 #pchs li, #lastComments li {background:none; border:none; -moz-box-shadow:none; width:140px !important;}
 #pchs, #lastComments { background: url('/userdir/7/9/5/8/795849/79215911.jpg'); border: 1px solid #000000; width: 140px !important; margin-left:5px; }
 #thisDiaryPhoto img { border: 1px solid #000000; }
 #Stats {padding: 5px 0px 5px 0px !important; margin: 5px 0 0 5px !important; }
 #YaSearchForm .submit {height:20px;}
 #YaSearchForm { visibility: visible !important; display: block !important;}
 #YaSearch, .menuSection li, #Stats { background: url('/userdir/7/9/5/8/795849/79215911.jpg'); border: 1px solid #000000; width: 150px !important; }
 {----------------------------------------------- posts ----------------------------------------------------}
 #page-c { margin-right: 30px !important; margin-bottom: 30px !important; margin-top: 30px !important; padding: 0px !important;}
 #page-t { background: #ffffff url('/userdir/7/9/5/8/795849/79216364.jpg') 0px 0 no-repeat ; padding: 440px 20px 20px 20px !important; border: 1px solid #000000; min-height: 900px !important;}
 #postsArea {padding: 0px !important;}
 .singlePost {margin: 0px 0 20px 0px !important; border: 1px solid #000000 !important;}
 .postContent { padding: 10px 20px 10px 20px !important; }
 .countFirst { background: #ffffff url('/userdir/7/9/5/8/795849/79215992.png') 0 0 no-repeat;}
 .countSecond { background: #ffffff url('/userdir/7/9/5/8/795849/79216457.png') 100% 100% no-repeat;}
 .postLinksBackg { background: url('/userdir/7/9/5/8/795849/70404375.png') 0 0 repeat-x; padding: 10px 20px 10px 20px !important; font: bold 11px Helvetica !important; color: #000000 !important; text-transform: lowercase;}
 .atMusic em, .atMood em, .atTag em { font-style: italicise; font-size: 100%;}
 .atMusic span:before {content: "музыка:"; font-size: 13px; }
 .atMusic span {font-size: 0px; }
 .atMood span:before {content: "настроение:"; font-size: 13px; }
 .atMood span {font-size: 0px; }
 .atTag span:before {content: "темы:"; font-size: 13px; }
 .atTag span {font-size: 0px; }
 .singlePost .urlLink a:after {content: ' записи';}
 {----------------------------------------------- headers ----------------------------------------------------}
 .postTitle, #addCommentArea_title { font: bold 14px Helvetica !important; background: url('/userdir/7/9/5/8/795849/70404375.png') 0 100% repeat-x !important; padding: 5px 20px 10px 20px !important; }
 .header h2 { font: bold 15px Helvetica !important; text-transform: lowercase; }
 #epigraph .postActionLinks { padding: 10px 20px 0px 0px !important; }
 #epigraph .header { padding: 30px 20px 0px 0px !important; }
 .postDate { font: bold 9px Helvetica !important; color: #000000 !important; text-transform: uppercase; padding: 10px 20px 10px 20px !important; text-align: center; background: url('/userdir/7/9/5/8/795849/70404375.png') 0 100% repeat-x;}
 #commentsArea_title, #new_post_title, .calHeader { font: bold 14px Helvetica !important; }
 #new_post_title {margin-left: 20px !important;}
 {----------------------------------------------- comments ----------------------------------------------------}
 #commentsArea {padding: 0px !important;}
 .singleComment, #addCommentArea {margin: 0px 0 20px 0px !important; border: 1px solid #000000 !important; background: #ffffff !important; }
 #addCommentArea {padding: 0px !important;}
 .authorName, .communityName { margin-left: 20px !important; }
 img { max-width: 525px !important;}
 #msg_form {padding: 10px 20px 10px 20px !important;}
 textarea#message, .htmlbox textarea, input.text, #trspisok textarea, #close_text {background: #f4f4f4;}
 a:link, a:visited {text-decoration:none !important;}
 a:hover, a:active {color: #000000 !important;}
 #side h1 a:hover {color: #be0c0c !important;}
 span.quote_text { font-style: normal !important; display: block; margin: 0px; padding: 10px; font-size: 11px; background: #ffffff; border: 1px solid #000000; }
 .submit { border: 1px solid #000000 !important;}

UPD: Спасибо, проблема решена через саппорт.

@темы: меню

URL

понедельник, 12 августа 2013

16:44

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

Здравствуйте. Я - совершенный нуб в этом деле, поэтому обращаюсь к вам за помощью.
Мне часто попадались дневники с таким дизайном: drawing-in-the-sky.diary.ru/
Я уже давно мечтаю сделать себе такой. ~~с другим фоном и цветом, естественно.~~ Но я совершенно не знаю, где такой дизайн можно найти или как его сделать. Может кто-нибудь что-нибудь посоветует?

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

URL

воскресенье, 11 августа 2013

05:28

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

Квинтэссенция хаоса.

Доброй ночи всем, кто не спит.

Хочу сделать так, чтобы блок записей в неактивном состоянии был прозрачен, либо очень слабо полупрозрачен и проявлялся бы при наведении. Это возможно? И, если да, то как?

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

URL

пятница, 09 августа 2013

18:40

Нужна помощь

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

Когда наступает депрессия или смятение, попробуй лечь на спину на полу и подними лапы вверх. Иногда мир выглядит лучше вверх ногами.

1. Делаю себе цсс, решила сделать заголовки разделов меню ("Мой дневник" и "Главное меню") видимыми. И вот такая фигня получилась:

смотреть

Шрифт отображается совсем не тот, который прописан. То есть название дневника и мой ник отображаются нужным шрифтом (AltastGreeting), а названия разделов - нет.
Подскажите, пожалуйста, что не так?
И если проще сделать названия картинками, то подскажите, пожалуйста, как это сделать. Я уже пробовала, но получилась полная жуть.

Код:

body {background: url("/userdir/1/6/1/9/1619707/79152956.jpg") repeat fixed;}
 #wrapper{min-width:1000px!important;width:800px;margin: 0 auto !important;padding:0 !important;overflow:hidden !important; margin-top: 5px !important;}
 #side{width:200px !important;margin:0 !important;}
 #side { filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; opacity: 0.8; }
 #page-c{width:770px !important;padding:0 !important;padding:0 !important;}
 #page-t {margin:0 !important;}
 #page-c, #side { border: border-width: 3 px; border-style: double; #171717;}
 #page-c { filter: alpha(opacity=90); -moz-opacity: 0.9; -khtml-opacity: 0.9; opacity: 0.9; }
 #page-c , #side{background:#fbf9ed;}
 body{ background-attachment:fixed; }
 .postDate { text-align:center;}
 .postDate span {font-style: italic !important; font-size: 14px !important; }
 .postLinksBackg {display:block !important; border-bottom: 1px solid #171717; margin-top: 10px !important; padding:10px 0 !important;}
 .avatar img,.avatarNew img {border: 1px solid #171717;}
 #epigraph a{text-decoration:none}
 a:hover,a:active{color: #171717 !important; text-decoration:none !important}
 .atTag a{text-decoration:none}
 #side h1 a{font: italic bold 34px AltastGreeting !important; }
 .paragraph {overflow: auto}
 .sign { font-style:italic;}
 #pchs_title {color: #cf9297 !important;}
 .menuSection {text-align: center !important; border-top: 1px solid #171717; padding: 0px 0 3px 0!important; }
 .paragraph div {margin-right: 5px !important; margin-left: 5px !important; }
 .postLinksBackg {margin-right: 5px !important; margin-left: 5px !important; }
 #authorName {font: italic bold 28px AltastGreeting !important; }
 #myDiaryLinks_title {font: italic bold 20px AltastGreeting !important; display:block; overflow:hidden; text-align: center!important;}
 #globalLinks_title {font: italic bold 20px AltastGreeting !important; display:block; overflow:hidden; text-align: center!important;}

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

URL

01:02

все записи пользователя в сообществе Демон Фотошопа

Воля, вера и воображение.

Чудят ссылки внизу комментариев. Причем чудят рондомно. По крайней мере не могу определить закономерность. В чем может быть дело? vampirenok-sakyra.diary.ru/p190616245.htm?from=...
Так должно выглядеть все
Так выглядят некоторые

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

URL

среда, 07 августа 2013

12:59

платные сервисы

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

утро\не\бодрит

подскажите, пожалуйста, имя элемента "Платные сервисы" в меню. =.=
—

#myAccountLink {display:none;}

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

URL

четверг, 01 августа 2013

17:21

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

химерная вечность

Уважаемые! У меня образовалась проблема на доселе исправном и давно функционирующем дизайне, съехало к чертям все, но только с Оперы.
Лицезреть проблему
Причем все странно и нифига непонятно, ибо вчера я сию чудную картину наблюдал с оперы тоже, сегодня ее видят только некоторые, в общем.
Прошу:
1. Протестить с Оперы, сообщить мне о том, что видите Вы.
2. И, если кто знает, сообщить, что это такое вообще, и как это лечится.

аттеншн! с других браузеров все нормально. вроде.
UPD:> с других то же, что и с оперы, у некоторых съезжают все эдд.блоки, у некоторых же все нормально.

хром
опера
Вопрошаю — КАК?

@темы: diaryCSS, платный сервис, Дизайн, Точка зрения

URL

среда, 31 июля 2013

01:40

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

You sexy and iTroll it

Здравствуйте.
Возник такой вопрос: как прилепить add_block к низу #page-c, Искала по соо, ничего путного не нашла.

URL

суббота, 27 июля 2013

18:56

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

Don't dream it - be it.

Возник вопрос. Если я устанавливаю на своём дневнике нестандартный шрифт, то у тех людей, у кого на компе такого шрифта нет, буду видеть тот, что задан в настройках, верно? У меня в настройках Courier New, но, когда я однажды заходила на дайри с чужого компа, то весь текст, который я вижу нестандартным шрифтом, я увидела то ли Times new roman, то ли типа того, но не заданный courier new точно. Вот. Вопроса два: какой шрифт у ссылок и заголовков видите вы и что мне делать? : D

11471140.diary.ru/

@темы: текст

URL

вторник, 23 июля 2013

22:52

масштабируемость видео

все записи пользователя в сообществе Bernadett-e

В море соли и так до чёрта, морю не надо слёз.

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

Вопрос, возможно, глупый, но по "ключевикам" я здесь не нашла, а моск вопросом уже высушила.

Можно ли здесь, в дайрях, средствами CSS заставить видео, вставленное через iframe, масштабироваться? А через местные стили? Не подбирая его ширину на хостинге, а именно через вёрстку.

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

URL

14:45

Нижнее меню

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

как нож в масло

Столкнулся вот с такой проблемой: чудо-юдо рыба хром не показывает нижнее меню. То, что оно там есть, видно только при выделении. В опере всё хорошо.

читать дальше

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

URL

суббота, 20 июля 2013

16:29

Вопросы от начинающего

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

печеня

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

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

body {margin:0; padding:0; background: url('/userdir/3/1/6/1/3161606/78983776.jpg') fixed !important;}
 h1 {height:300px;}
 #thisDiaryPhoto {display: none !important;}
 #wrapper{min-width:1000px!important; width:1000px; margin: 0 auto !important; padding:0 !important;}
 #bottomNavLinks {display: none;}
 #bottomNav {min-width:1000px!important; width:1000px; margin: 0 auto !important; padding:0 !important;}
 #postsArea .postContent{padding:30px;}
 #commentsArea .postContent{padding:30px;}
 #page-c, #bottomNav {width:1000px !important;min-width:0 !important;margin:0 auto !important;}
 .singleComment .postContent {padding:30px;}

Вопросы

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

URL


Запомнить