Сейчас у Вас CSS стоит или нет?

Градиент делается в фотошопе и заливается через ссылку в код.

Стоит. Не настолько я невежественна

Градиент делается в фотошопе и заливается через ссылку в код.
Хм... То есть я там рисую эту длинную узкую плашку и каким-то образом ее забиваю в код?
А вес страницы от этого вырастет?

Sephiroth, по идее совсем так не получится. Там в одном блоке со временем еще и title поста. И от него никуда не денешься.

Хм... То есть я там рисую эту длинную узкую плашку и каким-то образом ее забиваю в код?
В общем да. Полоска не большая, так что вес не сильно измениться.

Можно использовать CSS3. Если сами не умеете, то лучше всего воспользоваться каким-то генератором.
Например, вот этим: gradients.glrzad.com/

Извините, я еще и английского не знаю

То есть что - я там выставляю параметры двух цветов, тогда автоматически изменится код? Я его копирую, и что дальше? Куда его девать? В то же окошко в настройках дизайна дневника, где все остальные?
А где там ширина-длина этой полоски задается?

А в одну строчку время и дату нельзя, значит?

Sephiroth, да, делаете в фотошопе на прозрачном бэкграунде полоску нужных Вам размеров, сохраняете её в .png формате, заливаете в БИ и потом подставляете в код. Должно выйти примерно так:
.postDate {background: url('/userdir/1/7/1/2/1712500/57051920.gif') no-repeat; background-position:bottom; !important;}
В код вставлять только показанную часть ссылки, копировать её всю, до static.diary.ru/ - не нужно!

Куда его девать? В то же окошко в настройках дизайна дневника, где все остальные?
А где там ширина-длина этой полоски задается?

В поле ввода кода под общими настройками. Длину определяете сами в фш, смотря какой ширины у Вас блок записей задан - под него и делаете.

Как поставить время на один уровень с датой, не знаю.

То есть что - я там выставляю параметры двух цветов, тогда автоматически изменится код? Я его копирую, и что дальше? Куда его девать? В то же окошко в настройках дизайна дневника, где все остальные? А где там ширина-длина этой полоски задается?

Там линейный градиент. Он по ширине на весь объект растягивается.

А в одну строчку время и дату нельзя, значит?
Можно, но только еще и вместе с названием. Оно идет в одном блоке.
Примерно так:
.postDate { text-align: left!important; float: left; } .postTitle { text-align: right; } .authorName { clear: left; }

Спасибо
Попробую... Хотя с названием - это будет перебор уже, наверно.

А лучше эту полосу все-таки ставить в табличной версии дизайна или в блочной?

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

А лучше эту полосу все-таки ставить в табличной версии дизайна или в блочной?
у меня дневника нету. так что я разницы не знаю.
Тот, что здесь, видимо, блочный. А как выглядит табличный я не знаю.


Типа, декоративная буквица такая. Это как получить?
Сделать можно, вот только каждый первый элемент надо будет выделять. К примеру так:
span.firstletter { font-family: "Times New Roman", Times, serif; /* Гарнитура шрифта первой буквы */ font-size: 200%; /* Размер шрифта первого символа */ color: #900; /* Красный цвет текста */ padding: 3px; /*отступ от рамки*/ border: 1ps solid #900; /*рамка*/ }

при желании можно еще сделать обтекание.

Табличный - это вот, например. Отличается от блочного наличием этих самых полосок и дополнительным меню сверху (мне его не надо).
Собственно, в этом дайри как раз и градиент и буквы выделены.

Для градиента без разницы. Структура там та же.
В одном элементе дата. В другом время и название.

По поводу букв, то реализация там примерно такая:
.singlepost .paragraph div:first-letter { font-size: 200%; float: left !important; font-family: "Times New Roman", Times, serif; border: 3px solid #900 !important; padding: 2px 5px 2px 5px !important; margin-right: 3px !important; color: #900; line-height:100% !important; background: #fff !important; }

Спасибо. Буду пробовать

Большое спасибо за ссылку на генератор градиентов
Только 2 вопроса: нельзя ли сделать полосу пошире, а то очень узкая; и как убрать разделительную полоску от стандартного дизайна, которая у меня по-прежнему висит над каждой растяжкой? При этом чтобы она не появлялась только над растяжками, где дата, а посты, написанные в один день, по-прежнему делила бы?

А вот этот способ увеличить букву у меня не работает. То есть ничего не происходит.
Я просто копирую ваш код. Может, надо что-то еще дописать?

Sephiroth,
Только 2 вопроса: нельзя ли сделать полосу пошире, а то очень узкая; и как убрать разделительную полоску от стандартного дизайна, которая у меня по-прежнему висит над каждой растяжкой? При этом чтобы она не появлялась только над растяжками, где дата, а посты, написанные в один день, по-прежнему делила бы?
Градиент занимает весь блок. Соответственно регулируя ширину блока можно сделать полоску и шири.
Какие именно линии надо убрать я не понял.

А вот этот способ увеличить букву у меня не работает. То есть ничего не происходит. Я просто копирую ваш код. Может, надо что-то еще дописать?
Не знаю. Надо смотреть. Может что-то и мешает. Можно как-то посмотреть на текущий проект. Или хотя бы на текущий CSS код?

Градиент занимает весь блок. Соответственно регулируя ширину блока можно сделать полоску и шири.
Как?

Не знаю. Надо смотреть. Может что-то и мешает. Можно как-то посмотреть на текущий проект. Или хотя бы на текущий CSS код?
Ну вот так оно выглядит (это не эскиз дизайна, упаси Бог, это попытка протестировать опции СSS).



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

Код:
#authorQuot{display:none}
#authorLiks{display:none}
#authorRSS{display:none}
#rssLink{display:none}
#upInChart{display:none}
#allDiaryLink{display:none}
#favListLink{display:none}
#pchListLink{display:none}
#communityCatalogueLink{display:none}
#myCommunitiesLink{display:none}
#myCommunityLink{display:none}
#randomDiaryLink{display:none}
#thisDiaryPhoto{display:none}
#side h1 A{display:none}
#side{border: 2px solid #FFFFCC}
#page-t{border: 2px solid #FFFFCC}
.postDate {background-image: linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%); background-image: -o-linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%); background-image: -moz-linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%); background-image: -webkit-linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%); background-image: -ms-linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%); background-image: -webkit-gradient( linear, right top, left top, color-stop(0, rgb(8,112,112)), color-stop(0.68, rgb(205,230,228))}
.singlepost .paragraph div:first-letter { font-size: 200%; float: left !important; font-family: "Times New Roman", Times, serif; border: 3px solid #900 !important; padding: 2px 5px 2px 5px !important; margin-right: 3px !important; color: #900; line-height:100% !important; background: #fff !important; }

Догадываюсь, что жуть безграмотно.

Sephiroth, во-первых Вы забыли закрыть скобочку в последнем градиенте
background-image: -webkit-gradient( linear, right top, left top, color-stop(0, rgb(8,112,112)), color-stop(0.68, rgb(205,230,228)));

И ставьте точки с запятыми после каждого

По поводу полоски. Убрать ее можно (по идее) конструкцией
.postLinksBackg { border: none !important; }

По картинке трудно судить о порядке вложенности элементов. Так что точно не знаю почему не работает буквица. Попробуйте поиграться с порядком.

В общем, вот такой код попробуйте:
#authorQuot { display:none; }
#authorLiks { display:none; }
#authorRSS { display:none; }
#rssLink { display:none; }
#upInChart { display:none; }
#allDiaryLink { display:none; }
#favListLink { display:none; }
#pchListLink { display:none; }
#communityCatalogueLink { display:none; }
#myCommunitiesLink { display:none; }
#myCommunityLink { display:none; }
#randomDiaryLink { display:none; }
#thisDiaryPhoto { display:none; }
#side h1 A { display:none; }
#side { border: 2px solid #FFFFCC; }
#page-t { border: 2px solid #FFFFCC; }
.postDate {
background-image: linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%);
background-image: -o-linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%);
background-image: -moz-linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%);
background-image: -webkit-linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%);
background-image: -ms-linear-gradient(right , rgb(8,112,112) 0%, rgb(205,230,228) 68%);
background-image: -webkit-gradient( linear, right top, left top, color-stop(0, rgb(8,112,112)), color-stop(0.68, rgb(205,230,228)));
}

.countFirst .paragraph div:first-letter {
font-size: 200% !important;
float: left !important;
font-family: "Times New Roman", Times, serif;
border: 3px solid #900 !important;
padding: 2px 5px 2px 5px !important;
margin-right: 3px !important;
color: #900 !important;
line-height: 100% !important;
background: #fff !important;
}

.countSecond .paragraph div:first-letter {
font-size: 200% !important;
float: left !important;
font-family: "Times New Roman", Times, serif;
border: 3px solid #900 !important;
padding: 2px 5px 2px 5px !important;
margin-right: 3px !important;
color: #900 !important;
line-height: 100% !important;
background: #fff !important;
}

.postLinksBackg { border: none !important; }