подключен CSS

[Неми с норвежского]

Благодаря всенародным пожертвованиям, мне удалось подключить к сообществу CSS. Отныне появилась возможность экспериментировать с дизайном и оформлением. Пока я просмотрела все готовые оформления в "каталоге оформлений" дайриру и выбрала единственное, которое не обрезало длинные стрипы и хоть как-то соответствовало неминому характеру

Примеряя CSS-оформления я с неудовольствием отметила, что очень многие из подходящих по стилю имеют неприятную тенденцию обрезать стрипы до половины. А некоторые дают слишком узкую линию, так что стрипы торчат, и это выглядит неэстетично. Да, наше сообщество имеет довольно специфическую конфигурацию, и поэтому коды CSS должны ей соответствовать.

Если среди читателей и энтузиастов сообщества есть любители кодировать CSS, то я очень надеюсь на их отклик. Хотелось бы сделать дизайн этого сообщества действительно неповторимым, включив в него типичные для Неми элементы, но так, чтобы длинным стрипам тоже находилось место.

А пока оставлю этот дизайн и при возможности буду искать на сообществах по CSS дизайну

@темы: Сообщество

Comments

[Диана Шипилова]

Меню налезает на блок с записью, как-то неэстетично смотрится:

[RIP_AKK]

Может такая фиготень только у меня, но с меню вот такая проблема (браузер - хром):

[...Caramel...]

Mavca Sowilo, и у меня такая же - хром.

[Энтропия]

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

Mavca Sowilo, нет, у меня тоже такая фиготень
вы бы видели, как в других дизайнах это смотрится... там вообще мама дорогая...

[RIP_AKK]

Энтропия в энной степени, а сейчас ссылки добивают мой астигматизм Х_Х
Предыдущий был просто отличный, если бы не меню.

[Siimes]

Чтобы стрипы не обрезались, надо сделать значение для ширины блока записей соответствующее. То есть, если стрип 1478*475, то надо прописать в коде строчку так, указав ширину, ну, например, 1480:
#page-c{width:ШИРИНАpx !important;padding:0 !important;padding:0 !important}
Это вот строчка для стандартного диза с меню. Если делать с выпадающим меню, когда панель будет сверху, то всё немножко другое.

[Энтропия]

Mavca Sowilo, согласна, предыдущий мне нравился больще всего из тех, что можно было использовать

Siimes, спасибо! я попробую. если мне удастся найти коды этих дизайнов, то я попробую поменять

[Неми с норвежского]

Siimes, мне больше всего понравился этот, с черепами. вот код

html {background: #000000 url(' Картинка 1 ') repeat-x; background-position:50% 0 !important; background-attachment: fixed;}
 body {background: url(' Картинка 2 ') no-repeat; background-position:50% 0 !important;}
 #wrapper {min-width:952 px!important; width:952px; padding:0 !important; overflow:hidden !important; position:relative !important; margin: -10px auto -20px !important; }
 #extratop { background: url(' Картинка 3 '); width:952px; height:225px; line-height: 100% !important; }
 #extrabottom {background: url(' Картинка 4 ') no-repeat; width: 952px; height: 210px;line-height: 100% !important; margin-top: -42px !important; margin- bottom: -100px; }
 #JournalComments #extrabottom {background: url(' Картинка 4') no-repeat; width: 952px; height: 210px;line-height: 100% !important; margin-top: -32px !important; margin- bottom: -100px; }
 #side { margin-top:-185px !important; margin-left:24px !important; }
 .menuSection_title b, #iAmQuit a {text-decoration:none !important; text-transform:none !important; font-size: 20px !important; font-weight: lighter !important; font-family:Georgia !important; color: #5d605d !important; text-shadow: 2px 2px 2px #070807; line-height: 100%;}
 #favGroups, #favGroups a {text-decoration:none !important; text-transform:none !important; font-size: 18px !important; font-weight: lighter !important; font-family:Georgia !important; color: #3a3c3a !important; text-shadow: 1px 1px 1px #070807; line-height: 100%;}
 #favGroups:hover, #favGroups a:hover {text-decoration:none !important; text-transform:none !important; font-size: 18px !important; font-weight: lighter !important; font-family:Georgia !important; color: #5d605d !important; text-shadow: 1px 1px 1px #070807; line-height: 100%;}
 .menuSection ul li a, #umailLink, #myDiaryLink, #discussionLink {font-size: 12px !important; font-family: Georgia !important; color: #5d605d !important;}
 #thisDiaryOwner ul, #globalLinks ul {-moz-opacity:0.5 !important; opacity:0.5 !important; filter:alpha(opacity=50);}
 #thisDiaryOwner ul:hover, #globalLinks ul:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100);}
 .menuSection ul li a:hover, #myDiaryLinks ul a:hover {color: #899289 !important;}
 #thisDiaryLinks {display: none !important;}
 #lastComments {display: none !important;}
 #pchs {display: none !important;}
 #thisDiaryOwner { margin-top:0px !important; margin-left: 0px !important; }
 #thisDiaryOwner ul {display:block !important; visibility:visible !important; margin-left: -16px !important;}
 #myDiaryLinks { margin-top:-0px !important; margin-left: 110px !important; }
 #myDiaryLinks ul {display:block !important;visibility:visible !important; margin-left: -16px !important; }
 #myDiaryLinks ul a {color: #5d605d !important;}
 #myNotepadLink {display: none !important;}
 #albumLink {display: none !important;}
 #myProfileLink {display: none !important;}
 #optionsLink {display: none !important;}
 #photolibLink {display: none !important;}
 #globalLinks { margin-top:0px !important; margin-left: 40px !important; }
 #globalLinks ul {display:block !important; visibility:visible !important; margin-left: -16px !important;}
 #diarySpiritLink {display: none !important;}
 #diarySupportLink {display: none !important;}
 #faqLink {display: none !important;}
 #YaSearch {display: none !important;}
 #thisDiaryInfo {height:53px}
 #thisDiaryPhoto{display:none}
 #myLinksLink, #TagsList ul {display:none !important}
 #side h1 a { position:absolute !important; top:145px; right: 20px; font-size: 40px !important; font-family: Georgia !important; color: #3a3c3a !important; font-style: normal !important; text-shadow: 2px 2px 2px #070807;font-weight:normal !important; display:block; width:375px; text-align:right;line-height:35px;}
 #authorName { TEXT-DECORATION: none; position:absolute !important; top:100px; right: 20px; font-size: 28px !important; font-family: Georgia !important; color: #3a3c3a !important; font-style: italic !important; text-shadow: 2px 2px 2px #070807; font-weight: normal !important; display:block; width:365px; text-align:right;}
 #iAmQuit { margin-top:7px !important; margin-left: 293px !important; }
 .menuSection li { background: url(' Картинка 5 ') no-repeat left 5px; padding-left:10px!important; font-size:110%; }
 .postContent, #Stats, #bottomNav, .postDate, .authorName, .formcontainer, #commentsArea_title, #JournalCalenda, #newCommentsArea, .communityName, #favGroups {width:895px !important; padding:0; margin-left:18px !important;}
 .communityName {display:inline-block; margin-bottom: 6px !important; margin-top: -10px !important;}
 #commentsArea_title, #addCommentArea_title, .header.calHeader, #new_post_title {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #535654; font-size: 15pt !important; padding-left:20px!important; text-shadow: 2px 2px 2px #070807; text-align:center;}
 #commentsArea_title, #addCommentArea_title {display:block; margin-bottom: 5px !important; margin-top: -20px !important;}
 .postActionLinks { left:-13px;}
 #sortOrder {display: none !important;}
 #page-c { background: url(' Картинка 6 ') repeat-y; width:952px !important; margin-top: 104px !important;}
 A, .atTag a, .postLinksBackg, #bottomNav a {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #3a3c3a; font-size: 10pt !important;}
 A:hover, .postLinksBackg:hover, #bottomNav a:hover {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #5d605d; font-size: 10pt !important;}
 .postTitle span{ TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #454745; font-size: 15pt !important;padding-left:30px!important; text-shadow: 2px 2px 2px #000; display:block; background: url(' Картинка 7 ') repeat-x; height: 35px; line-height: 100% !important; padding-top:7px; margin-left:8px !important; padding-right: 30px !important; margin-right: 30px !important; width:170px}
 .singlePost .postTitle span {width:50px !important}
 .header h2 {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #535654; font-size: 16pt !important; text-shadow: 2px 2px 2px #070807; position:absolute; margin-top:-38px; margin-left:130px }
 .postDate, .countSecond .postDate {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #454745; font-size: 14pt !important;}
 .paragraph {font-size: 11pt !important; font-family: Georgia; !important; line-height: 1.2em;}
 .postLinksBackg {background: url(' Картинка 8 ')right bottom no-repeat; background-position: 50% 50%; margin-top:10px; margin-bottom: -15px ;}
 .postLinks {display:block; padding-right: 15px;}
 .postLinks {margin-top: -4px;}
 .avatar img {width:80px !important; min-width:80px !important; max-width:80px!important; border: 6px solid rgba(0, 0, 0, 0.3) !important;}
 .addToQuote, .subscribe, .unsubscribe, .quote_post, .umail, .diary, .profile, .comments, .urlLink, .quote_comment, #pageBar a, #bottom_up, #bottom_mainlink, #bottom_randomlink, #bottom_spiritlink, #bottom_faqlink, .email, .delFromQuote.lastLink { background: url(' Картинка 9 ') repeat-x ; background-position: 0% 0% !important; height: 27px; line-height: 100% !important; position: relative !important; top: 0 px;}
 .addToQuote, .subscribe, .unsubscribe, .quote_post, .umail, .diary, .profile, .comments, .urlLink, .quote_comment, #pageBar a, #Stats, .email, .delFromQuote.lastLink {padding: 6px 6px !important; margin: 0px 2px !important;}
 #bottom_up, #bottom_mainlink, #bottom_randomlink, #bottom_spiritlink, #bottom_faqlink {padding: 6px 6px !important; margin: 0px 2px !important;}
 .urlLink {display:inline-block; top: -10px !important; left: 15px;}
 .sign {color: #3a3c3a !important;}
 .prevnext {display: none !important;}
 #lastComments {display: none !important;}
 .section {width:895px !important; padding:0; margin-left:13px !important;}
 #selectedavataruri {width:80px !important; min-width:80px !important; max-width:80px!important; -moz-opacity:0.3 !important;opacity:0.3 !important; filter:alpha(opacity=30); }
 #selectedavataruri:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100); }
 #message, input.text, select, #trspisok textarea, #de#ion, #close_text, #side #search_selectbtid {display:inline-block; background: url(' Картинка 9 ') repeat ; background-position: 0% 0% !important;}
 .section, #msg_form {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #3a3c3a; font-size: 10pt !important;}
 #change_bg_area, #change_bg_area_comm {display: none !important;}
 #addCommentArea {display:inline-block; margin-top: 20px !important;}
 .singlePost span.quote_text {background: url(' Картинка 10 ') no-repeat !important; display: block; font-style:italic !important;}
 .singlePost span.quote_text {background:none no-repeat scroll 6px 8px; margin: 0 25px 0 25px; overflow:hidden; padding:10px; }
 #JournalCalendar #content {margin-left:210px}
 #pageBar td {height: 30px}
 #side h1 a .opac6 {display:none}
 .tags_ul_all {margin-left:15px}
 .tags_ul_all span {margin-top:3px}
 .tags_ul_all a:hover {text-decoration:none !important}
 .tags_ul_all a{display:block; border: 1px solid transparent; padding:2px}
 .tags_ul_all a:hover{display:block; background: url(' Картинка 9 ') !important;}
 .tags_header a:hover {display:block; border: 1px solid transparent !important; background:transparent !important}

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

[Неми с норвежского]

Siimes, мне больше всего понравился этот, с черепами. вот код

html {background: #000000 url(' Картинка 1 ') repeat-x; background-position:50% 0 !important; background-attachment: fixed;}
 body {background: url(' Картинка 2 ') no-repeat; background-position:50% 0 !important;}
 #wrapper {min-width:952 px!important; width:952px; padding:0 !important; overflow:hidden !important; position:relative !important; margin: -10px auto -20px !important; }
 #extratop { background: url(' Картинка 3 '); width:952px; height:225px; line-height: 100% !important; }
 #extrabottom {background: url(' Картинка 4 ') no-repeat; width: 952px; height: 210px;line-height: 100% !important; margin-top: -42px !important; margin- bottom: -100px; }
 #JournalComments #extrabottom {background: url(' Картинка 4') no-repeat; width: 952px; height: 210px;line-height: 100% !important; margin-top: -32px !important; margin- bottom: -100px; }
 #side { margin-top:-185px !important; margin-left:24px !important; }
 .menuSection_title b, #iAmQuit a {text-decoration:none !important; text-transform:none !important; font-size: 20px !important; font-weight: lighter !important; font-family:Georgia !important; color: #5d605d !important; text-shadow: 2px 2px 2px #070807; line-height: 100%;}
 #favGroups, #favGroups a {text-decoration:none !important; text-transform:none !important; font-size: 18px !important; font-weight: lighter !important; font-family:Georgia !important; color: #3a3c3a !important; text-shadow: 1px 1px 1px #070807; line-height: 100%;}
 #favGroups:hover, #favGroups a:hover {text-decoration:none !important; text-transform:none !important; font-size: 18px !important; font-weight: lighter !important; font-family:Georgia !important; color: #5d605d !important; text-shadow: 1px 1px 1px #070807; line-height: 100%;}
 .menuSection ul li a, #umailLink, #myDiaryLink, #discussionLink {font-size: 12px !important; font-family: Georgia !important; color: #5d605d !important;}
 #thisDiaryOwner ul, #globalLinks ul {-moz-opacity:0.5 !important; opacity:0.5 !important; filter:alpha(opacity=50);}
 #thisDiaryOwner ul:hover, #globalLinks ul:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100);}
 .menuSection ul li a:hover, #myDiaryLinks ul a:hover {color: #899289 !important;}
 #thisDiaryLinks {display: none !important;}
 #lastComments {display: none !important;}
 #pchs {display: none !important;}
 #thisDiaryOwner { margin-top:0px !important; margin-left: 0px !important; }
 #thisDiaryOwner ul {display:block !important; visibility:visible !important; margin-left: -16px !important;}
 #myDiaryLinks { margin-top:-0px !important; margin-left: 110px !important; }
 #myDiaryLinks ul {display:block !important;visibility:visible !important; margin-left: -16px !important; }
 #myDiaryLinks ul a {color: #5d605d !important;}
 #myNotepadLink {display: none !important;}
 #albumLink {display: none !important;}
 #myProfileLink {display: none !important;}
 #optionsLink {display: none !important;}
 #photolibLink {display: none !important;}
 #globalLinks { margin-top:0px !important; margin-left: 40px !important; }
 #globalLinks ul {display:block !important; visibility:visible !important; margin-left: -16px !important;}
 #diarySpiritLink {display: none !important;}
 #diarySupportLink {display: none !important;}
 #faqLink {display: none !important;}
 #YaSearch {display: none !important;}
 #thisDiaryInfo {height:53px}
 #thisDiaryPhoto{display:none}
 #myLinksLink, #TagsList ul {display:none !important}
 #side h1 a { position:absolute !important; top:145px; right: 20px; font-size: 40px !important; font-family: Georgia !important; color: #3a3c3a !important; font-style: normal !important; text-shadow: 2px 2px 2px #070807;font-weight:normal !important; display:block; width:375px; text-align:right;line-height:35px;}
 #authorName { TEXT-DECORATION: none; position:absolute !important; top:100px; right: 20px; font-size: 28px !important; font-family: Georgia !important; color: #3a3c3a !important; font-style: italic !important; text-shadow: 2px 2px 2px #070807; font-weight: normal !important; display:block; width:365px; text-align:right;}
 #iAmQuit { margin-top:7px !important; margin-left: 293px !important; }
 .menuSection li { background: url(' Картинка 5 ') no-repeat left 5px; padding-left:10px!important; font-size:110%; }
 .postContent, #Stats, #bottomNav, .postDate, .authorName, .formcontainer, #commentsArea_title, #JournalCalenda, #newCommentsArea, .communityName, #favGroups {width:895px !important; padding:0; margin-left:18px !important;}
 .communityName {display:inline-block; margin-bottom: 6px !important; margin-top: -10px !important;}
 #commentsArea_title, #addCommentArea_title, .header.calHeader, #new_post_title {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #535654; font-size: 15pt !important; padding-left:20px!important; text-shadow: 2px 2px 2px #070807; text-align:center;}
 #commentsArea_title, #addCommentArea_title {display:block; margin-bottom: 5px !important; margin-top: -20px !important;}
 .postActionLinks { left:-13px;}
 #sortOrder {display: none !important;}
 #page-c { background: url(' Картинка 6 ') repeat-y; width:952px !important; margin-top: 104px !important;}
 A, .atTag a, .postLinksBackg, #bottomNav a {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #3a3c3a; font-size: 10pt !important;}
 A:hover, .postLinksBackg:hover, #bottomNav a:hover {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #5d605d; font-size: 10pt !important;}
 .postTitle span{ TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #454745; font-size: 15pt !important;padding-left:30px!important; text-shadow: 2px 2px 2px #000; display:block; background: url(' Картинка 7 ') repeat-x; height: 35px; line-height: 100% !important; padding-top:7px; margin-left:8px !important; padding-right: 30px !important; margin-right: 30px !important; width:170px}
 .singlePost .postTitle span {width:50px !important}
 .header h2 {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #535654; font-size: 16pt !important; text-shadow: 2px 2px 2px #070807; position:absolute; margin-top:-38px; margin-left:130px }
 .postDate, .countSecond .postDate {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #454745; font-size: 14pt !important;}
 .paragraph {font-size: 11pt !important; font-family: Georgia; !important; line-height: 1.2em;}
 .postLinksBackg {background: url(' Картинка 8 ')right bottom no-repeat; background-position: 50% 50%; margin-top:10px; margin-bottom: -15px ;}
 .postLinks {display:block; padding-right: 15px;}
 .postLinks {margin-top: -4px;}
 .avatar img {width:80px !important; min-width:80px !important; max-width:80px!important; border: 6px solid rgba(0, 0, 0, 0.3) !important;}
 .addToQuote, .subscribe, .unsubscribe, .quote_post, .umail, .diary, .profile, .comments, .urlLink, .quote_comment, #pageBar a, #bottom_up, #bottom_mainlink, #bottom_randomlink, #bottom_spiritlink, #bottom_faqlink, .email, .delFromQuote.lastLink { background: url(' Картинка 9 ') repeat-x ; background-position: 0% 0% !important; height: 27px; line-height: 100% !important; position: relative !important; top: 0 px;}
 .addToQuote, .subscribe, .unsubscribe, .quote_post, .umail, .diary, .profile, .comments, .urlLink, .quote_comment, #pageBar a, #Stats, .email, .delFromQuote.lastLink {padding: 6px 6px !important; margin: 0px 2px !important;}
 #bottom_up, #bottom_mainlink, #bottom_randomlink, #bottom_spiritlink, #bottom_faqlink {padding: 6px 6px !important; margin: 0px 2px !important;}
 .urlLink {display:inline-block; top: -10px !important; left: 15px;}
 .sign {color: #3a3c3a !important;}
 .prevnext {display: none !important;}
 #lastComments {display: none !important;}
 .section {width:895px !important; padding:0; margin-left:13px !important;}
 #selectedavataruri {width:80px !important; min-width:80px !important; max-width:80px!important; -moz-opacity:0.3 !important;opacity:0.3 !important; filter:alpha(opacity=30); }
 #selectedavataruri:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100); }
 #message, input.text, select, #trspisok textarea, #de#ion, #close_text, #side #search_selectbtid {display:inline-block; background: url(' Картинка 9 ') repeat ; background-position: 0% 0% !important;}
 .section, #msg_form {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #3a3c3a; font-size: 10pt !important;}
 #change_bg_area, #change_bg_area_comm {display: none !important;}
 #addCommentArea {display:inline-block; margin-top: 20px !important;}
 .singlePost span.quote_text {background: url(' Картинка 10 ') no-repeat !important; display: block; font-style:italic !important;}
 .singlePost span.quote_text {background:none no-repeat scroll 6px 8px; margin: 0 25px 0 25px; overflow:hidden; padding:10px; }
 #JournalCalendar #content {margin-left:210px}
 #pageBar td {height: 30px}
 #side h1 a .opac6 {display:none}
 .tags_ul_all {margin-left:15px}
 .tags_ul_all span {margin-top:3px}
 .tags_ul_all a:hover {text-decoration:none !important}
 .tags_ul_all a{display:block; border: 1px solid transparent; padding:2px}
 .tags_ul_all a:hover{display:block; background: url(' Картинка 9 ') !important;}
 .tags_header a:hover {display:block; border: 1px solid transparent !important; background:transparent !important}

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

[Неми с норвежского]

Siimes, мне больше всего понравился этот, с черепами. вот код

html {background: #000000 url(' Картинка 1 ') repeat-x; background-position:50% 0 !important; background-attachment: fixed;}
 body {background: url(' Картинка 2 ') no-repeat; background-position:50% 0 !important;}
 #wrapper {min-width:952 px!important; width:952px; padding:0 !important; overflow:hidden !important; position:relative !important; margin: -10px auto -20px !important; }
 #extratop { background: url(' Картинка 3 '); width:952px; height:225px; line-height: 100% !important; }
 #extrabottom {background: url(' Картинка 4 ') no-repeat; width: 952px; height: 210px;line-height: 100% !important; margin-top: -42px !important; margin- bottom: -100px; }
 #JournalComments #extrabottom {background: url(' Картинка 4') no-repeat; width: 952px; height: 210px;line-height: 100% !important; margin-top: -32px !important; margin- bottom: -100px; }
 #side { margin-top:-185px !important; margin-left:24px !important; }
 .menuSection_title b, #iAmQuit a {text-decoration:none !important; text-transform:none !important; font-size: 20px !important; font-weight: lighter !important; font-family:Georgia !important; color: #5d605d !important; text-shadow: 2px 2px 2px #070807; line-height: 100%;}
 #favGroups, #favGroups a {text-decoration:none !important; text-transform:none !important; font-size: 18px !important; font-weight: lighter !important; font-family:Georgia !important; color: #3a3c3a !important; text-shadow: 1px 1px 1px #070807; line-height: 100%;}
 #favGroups:hover, #favGroups a:hover {text-decoration:none !important; text-transform:none !important; font-size: 18px !important; font-weight: lighter !important; font-family:Georgia !important; color: #5d605d !important; text-shadow: 1px 1px 1px #070807; line-height: 100%;}
 .menuSection ul li a, #umailLink, #myDiaryLink, #discussionLink {font-size: 12px !important; font-family: Georgia !important; color: #5d605d !important;}
 #thisDiaryOwner ul, #globalLinks ul {-moz-opacity:0.5 !important; opacity:0.5 !important; filter:alpha(opacity=50);}
 #thisDiaryOwner ul:hover, #globalLinks ul:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100);}
 .menuSection ul li a:hover, #myDiaryLinks ul a:hover {color: #899289 !important;}
 #thisDiaryLinks {display: none !important;}
 #lastComments {display: none !important;}
 #pchs {display: none !important;}
 #thisDiaryOwner { margin-top:0px !important; margin-left: 0px !important; }
 #thisDiaryOwner ul {display:block !important; visibility:visible !important; margin-left: -16px !important;}
 #myDiaryLinks { margin-top:-0px !important; margin-left: 110px !important; }
 #myDiaryLinks ul {display:block !important;visibility:visible !important; margin-left: -16px !important; }
 #myDiaryLinks ul a {color: #5d605d !important;}
 #myNotepadLink {display: none !important;}
 #albumLink {display: none !important;}
 #myProfileLink {display: none !important;}
 #optionsLink {display: none !important;}
 #photolibLink {display: none !important;}
 #globalLinks { margin-top:0px !important; margin-left: 40px !important; }
 #globalLinks ul {display:block !important; visibility:visible !important; margin-left: -16px !important;}
 #diarySpiritLink {display: none !important;}
 #diarySupportLink {display: none !important;}
 #faqLink {display: none !important;}
 #YaSearch {display: none !important;}
 #thisDiaryInfo {height:53px}
 #thisDiaryPhoto{display:none}
 #myLinksLink, #TagsList ul {display:none !important}
 #side h1 a { position:absolute !important; top:145px; right: 20px; font-size: 40px !important; font-family: Georgia !important; color: #3a3c3a !important; font-style: normal !important; text-shadow: 2px 2px 2px #070807;font-weight:normal !important; display:block; width:375px; text-align:right;line-height:35px;}
 #authorName { TEXT-DECORATION: none; position:absolute !important; top:100px; right: 20px; font-size: 28px !important; font-family: Georgia !important; color: #3a3c3a !important; font-style: italic !important; text-shadow: 2px 2px 2px #070807; font-weight: normal !important; display:block; width:365px; text-align:right;}
 #iAmQuit { margin-top:7px !important; margin-left: 293px !important; }
 .menuSection li { background: url(' Картинка 5 ') no-repeat left 5px; padding-left:10px!important; font-size:110%; }
 .postContent, #Stats, #bottomNav, .postDate, .authorName, .formcontainer, #commentsArea_title, #JournalCalenda, #newCommentsArea, .communityName, #favGroups {width:895px !important; padding:0; margin-left:18px !important;}
 .communityName {display:inline-block; margin-bottom: 6px !important; margin-top: -10px !important;}
 #commentsArea_title, #addCommentArea_title, .header.calHeader, #new_post_title {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #535654; font-size: 15pt !important; padding-left:20px!important; text-shadow: 2px 2px 2px #070807; text-align:center;}
 #commentsArea_title, #addCommentArea_title {display:block; margin-bottom: 5px !important; margin-top: -20px !important;}
 .postActionLinks { left:-13px;}
 #sortOrder {display: none !important;}
 #page-c { background: url(' Картинка 6 ') repeat-y; width:952px !important; margin-top: 104px !important;}
 A, .atTag a, .postLinksBackg, #bottomNav a {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #3a3c3a; font-size: 10pt !important;}
 A:hover, .postLinksBackg:hover, #bottomNav a:hover {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #5d605d; font-size: 10pt !important;}
 .postTitle span{ TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #454745; font-size: 15pt !important;padding-left:30px!important; text-shadow: 2px 2px 2px #000; display:block; background: url(' Картинка 7 ') repeat-x; height: 35px; line-height: 100% !important; padding-top:7px; margin-left:8px !important; padding-right: 30px !important; margin-right: 30px !important; width:170px}
 .singlePost .postTitle span {width:50px !important}
 .header h2 {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #535654; font-size: 16pt !important; text-shadow: 2px 2px 2px #070807; position:absolute; margin-top:-38px; margin-left:130px }
 .postDate, .countSecond .postDate {TEXT-DECORATION: none; text-transform: none; font-family: 'Times New Roman', Times, serif !important; font-weight: bolder !important; color: #454745; font-size: 14pt !important;}
 .paragraph {font-size: 11pt !important; font-family: Georgia; !important; line-height: 1.2em;}
 .postLinksBackg {background: url(' Картинка 8 ')right bottom no-repeat; background-position: 50% 50%; margin-top:10px; margin-bottom: -15px ;}
 .postLinks {display:block; padding-right: 15px;}
 .postLinks {margin-top: -4px;}
 .avatar img {width:80px !important; min-width:80px !important; max-width:80px!important; border: 6px solid rgba(0, 0, 0, 0.3) !important;}
 .addToQuote, .subscribe, .unsubscribe, .quote_post, .umail, .diary, .profile, .comments, .urlLink, .quote_comment, #pageBar a, #bottom_up, #bottom_mainlink, #bottom_randomlink, #bottom_spiritlink, #bottom_faqlink, .email, .delFromQuote.lastLink { background: url(' Картинка 9 ') repeat-x ; background-position: 0% 0% !important; height: 27px; line-height: 100% !important; position: relative !important; top: 0 px;}
 .addToQuote, .subscribe, .unsubscribe, .quote_post, .umail, .diary, .profile, .comments, .urlLink, .quote_comment, #pageBar a, #Stats, .email, .delFromQuote.lastLink {padding: 6px 6px !important; margin: 0px 2px !important;}
 #bottom_up, #bottom_mainlink, #bottom_randomlink, #bottom_spiritlink, #bottom_faqlink {padding: 6px 6px !important; margin: 0px 2px !important;}
 .urlLink {display:inline-block; top: -10px !important; left: 15px;}
 .sign {color: #3a3c3a !important;}
 .prevnext {display: none !important;}
 #lastComments {display: none !important;}
 .section {width:895px !important; padding:0; margin-left:13px !important;}
 #selectedavataruri {width:80px !important; min-width:80px !important; max-width:80px!important; -moz-opacity:0.3 !important;opacity:0.3 !important; filter:alpha(opacity=30); }
 #selectedavataruri:hover {-moz-opacity:1.0 !important; opacity:1.0 !important; filter:alpha(opacity=100); }
 #message, input.text, select, #trspisok textarea, #de#ion, #close_text, #side #search_selectbtid {display:inline-block; background: url(' Картинка 9 ') repeat ; background-position: 0% 0% !important;}
 .section, #msg_form {TEXT-DECORATION: none; text-transform: none; font-family: Georgia !important; color: #3a3c3a; font-size: 10pt !important;}
 #change_bg_area, #change_bg_area_comm {display: none !important;}
 #addCommentArea {display:inline-block; margin-top: 20px !important;}
 .singlePost span.quote_text {background: url(' Картинка 10 ') no-repeat !important; display: block; font-style:italic !important;}
 .singlePost span.quote_text {background:none no-repeat scroll 6px 8px; margin: 0 25px 0 25px; overflow:hidden; padding:10px; }
 #JournalCalendar #content {margin-left:210px}
 #pageBar td {height: 30px}
 #side h1 a .opac6 {display:none}
 .tags_ul_all {margin-left:15px}
 .tags_ul_all span {margin-top:3px}
 .tags_ul_all a:hover {text-decoration:none !important}
 .tags_ul_all a{display:block; border: 1px solid transparent; padding:2px}
 .tags_ul_all a:hover{display:block; background: url(' Картинка 9 ') !important;}
 .tags_header a:hover {display:block; border: 1px solid transparent !important; background:transparent !important}

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

[Siimes]

Неми с норвежского, сейчас подумаю)

[Неми с норвежского]

так, я закачала все картинки для этого дизайна в библиотеку изображений и даже заменила все, что указано в комментариях к этой записи (orden-css.diary.ru/p126853721.htm)

но почему-то верхнее меню сдвинуто!

[RIP_AKK]

Уютно, но вот "u-mail дневник профиль поделиться" в комментариях уплыли

(я тут не задолбала своими комментариями-замечаниями?)

[Неми с норвежского]

Mavca Sowilo, да нет, все в порядке.. просто сейчас с дизайном сообщества гораздо более глобальные проблемы. например, то что стрипы обрезаются и меню кривит

[Siimes]

Посмотрела у себя - ничего в меню не сдвигается... Я поставила дизайн блочный, меню сверху.

Так, чтобы влезли стрипы, нам нужно растянуть в ширину блок записей. Там, где написано width:952px число нужно проставить 1480. И посмотрим, как получится.
То есть строчки поправить вот эти:

#wrapper {min-width:952 px!important; width:952px; padding:0 !important; overflow:hidden !important; position:relative !important; margin: -10px auto -20px !important; }
#extratop { background: #; width:952px; height:225px; line-height: 100% !important; }
#extrabottom {background: # no-repeat; width: 952px; height: 210px;line-height: 100% !important; margin-top: -42px !important; margin- bottom: -100px; }
#JournalComments #extrabottom {background: # no-repeat; width: 952px; height: 210px;line-height: 100% !important; margin-top: -32px !important; margin- bottom: -100px; }

#page-c { background: # repeat-y; width:952px !important; margin-top: 104px !important;}

#lastComments {display: none !important;}
.section {width:895px !important; padding:0; margin-left:13px !important;}

Надо ещё посмотреть, что ещё может съехать в дизе из-за увеличения этих цифр. Тогда нужно будет рассчитывать всё остальное.
Честно говоря, я не всё знаю в этом коде, потому что сама пользуюсь довольно простеньким кодом и простеньким дизайном.

[Неми с норвежского]

Siimes, так....я поменяла ширину. но от этого ничего не поменялось.

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

[RIP_AKK]

С картинками: очень грубый, но просто ход (правда не помню работает ли он в CSS, но должен) - www.diary.ru/options/site/?msgtags в первом пункте выбрать вторую опцию.

Еще вариант увеличить ширину блока записей:

#wrapper {min-width:952 px!important; width:952px; padding:0 !important; overflow:hidden !important; position:relative !important; margin: -10px auto -20px !important; }

Циферка 952 - отвечает за ширину.
А еще сообщество CSS советует просто убрать из этого фрагмента кода overflow:hidden !important;

[RIP_AKK]

последний раз баловалась с кодом на дайри лет 5 назад, так что сильно тапками не бить

[Siimes]

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

[Siimes]

А! Вот ещё почему может так всё съезжать!
Дизайн сделан под дневник, где в меню всего 3 колонки. А у сообществ их больше - добавляется колонка под сообщество. Я думаю, здесь выход - растянуть самое тело, а цифры под меню - уменьшить, чтобы влезло всё.

Хотя нет. Конечно, изначально в коде надо планировать под свои значения. То есть, поле под запись шириной должно быть примерно в 1480. Плюс учесть поле, где аватарка автора записи.
Картинки наверху и внизу уже заданы определённым значением - 952. Как бы мы не растягивали в коде цифры, надо эти картинки иметь нужной нам ширины. Может быть, можно попросить автора этого дизайна переделать его под Ваше сообщество?

[Энтропия]

Mavca Sowilo, насчет симга я думала, но посмотрев как оно выглядит решила не делать. иногда картинка обрубается на начале последнего фрейма и у читателы может сложится впечатление, что стрип отобразился полностью. он может не заметить скролл...

[Неми с норвежского]

Mavca Sowilo, удалила overflow! теперь картинки не обрезаются

Siimes, а может можно убрать колонку под сообщество? было бы здорово. или поставить ее под другую колонку...

[Stigravian Shaderstill]

не, сейчас дизайн ещё хуже моего

[Неми с норвежского]

Stigravian Shaderstill, я жажду конструктивной критики

[Siimes]

Неми с норвежского, нет, убрать нельзя, можно сделать выпадающее меню.

[Неми с норвежского]

Siimes, а оно ведь и так выпадающее... а может быть можно под "моим сообществом разместить другую колонку?

[Stigravian Shaderstill]

Неми с норвежского, у меня сейчас отображается тёмно-серый дизайн с черепами, читается очень напряжно, элементы меню вылезают за границы.
Ну и вообще "узкие" дизайны какие-то нерациональные, имхо. "Орден КСС" мало хорошего производит.

[Siimes]

Неми с норвежского, оно у меня выпадает только при наведении на раздел "Сообщество". Всё остальное видно и просто подсвечивается.
Код под выпадающее меню что-то вроде такого:

#side{width:ШИРИНАpx !important; margin:0 !important; }
.menuSection ul {width: ШИРИНАpx; height: ВЫСОТКАpx; background: url('/userdir/') !important; }
.menuSection {text-align:center; }

Так, можно убрать всё меню строчкой:
#side{position:fixed}

Но, по-моему, это жесть)

Можно убрать отдельные элементы, выбрав из этого:
#myStatLink{display:none}
#postTitle {width: 400px }
#upInChart {display:none}
#allDiaryLink{display:none}
#mainpageLink{display:none}
#favListLink{display:none}
#pchListLink{display:none}
#communityCatalogueLink{display:none}
#randomDiaryLink{display:none}
#diarySpiritLink{display:none}
#diarySupportLink{display:none}
#paySupportLink{display:none}
#faqLink{display:none}
#topNav{display:none}
#myProfileLink{display:none}
#myStatLink{display:none}
#upInChart{display:none}

Вот тут есть список всех объектов в коде CSS для дайри с пояснением, что есть что. И тут тоже писали.

[Неми с норвежского]

Siimes, кажется, мне удалось убрать меню для сообщества! теперь пытаюсь найти как сдвинуть меню влево


Stigravian Shaderstill, над элементами меню сейчас работаем. насчет неудобности узких дневников не согласна. этот дневник довольно широкий по сравнению с некоторыми другими.

читается очень напряжно

поясни почему? я ведь могу сделать текст посветлее?

[Siimes]

Неми с норвежского, строчка меню это #side
Вот примерно в такой строчке надо менять значения:
#side {position:absolute; top:63px; left:30px;}
Top - это отступ сверху, left - это отступ слева.

Колонки меню немного друг на друга наползают.