Ознакомьтесь с нашей политикой обработки персональных данных
20:50 

Темы записей, эпиграф, отступы и другое

SnezhArt
ретроградный оптимист
И снова я. И снова с багажом вопросов. Здравствуйте. ))
Делаю очередной дизайн, и как всегда, в конце не обойтись без помощи. :beg:

Сначала баги:
1. Темы записей. Это просто...
решено

2. Эпиграф. Мое больное место. ><
решено

3. Цитатник.
решено

4. Область подписи и имени.
решено

5. Отступ синглпоста.
решено

Советы обучающимся

Все решения найдены. Спасибо Тайя, которая душит романтиков, Ренос. Отдельное спасибо Min Young-nim за тщательное объяснение тонких моментов. image

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

Комментарии
2015-01-07 в 21:25 

Тайя, которая душит романтиков
Не говорите так быстро, я не успеваю класть х*р на ваши слова.
2. #post0 {border: none ! important;} По-моему, это и в черновиках должно помочь.

2015-01-07 в 21:59 

Тайя, которая душит романтиков
Не говорите так быстро, я не успеваю класть х*р на ваши слова.
1. Темы находятся внутри #thisDiaryOwner , поэтому их надо z-индексом вытащить наверх
#thisDiaryOwner {position: relative; z-index: 100 !important;}
#TagsList a {color: #fff;}

Кнопку вставить цитату попробуйте прибить обратно с помощью margin-top: -500px !important

2015-01-09 в 05:44 

Ренос
Тесты, просто тесты.
1.1. Тут я вижу 2 пути:
а) Сделать шрифт прозрачным (color: transparent) и засунуть картинку в background. Но тогда при выделении надпись будет проявляться.
б) расположить блок с картинкой поверх блока с надписью через :after, чтобы банально скрыть текст. Более геморройный вариант.

2.2. Если я правильно понимаю, то "верхний отступ" - это .postTitle. У записей там заголовок и время написания. У эпиграфа же просто пустая строка.

5. Я бы для отступов в комментариях редактировал не .singlePost, а .lastPost. Если я не ошибаюсь, .lastPost только в комментариях и задействован, на главной странице он не используется.

2015-01-09 в 06:08 

Ренос
Тесты, просто тесты.
8. Т.е. надо уменьшить аватарку? Или надо "растянуть" аватарку в 50px до 100px?
9. Через абсолютное позиционирование элемента. Например, так: #thisDiaryPhoto {position: absolute; top: 10%; left: 50%}

2015-01-09 в 10:27 

SnezhArt
ретроградный оптимист
Тайя, которая душит романтиков, с эпиграфом на главной у меня наладилось, а вот в черновиках по-прежнему какой-то дикий отступ есть. тт
темы вытащились из-под меню, спасибо! **
"вставить цитату" тоже получилось поставить на место. х))


Ренос, расположить блок с картинкой поверх блока с надписью через :after, чтобы банально скрыть текст
а не подскажите, плиз, как примерно код должен выглядеть? %)
с отступами получилось. спасибо! **
Т.е. надо уменьшить аватарку?
да-да-да. видела дизайны, где аватарки красиво так уменьшены до 50px ))



а как с 4 вопросом разобраться не подскажите?
и я еще хотела спросить, может тоже знаете. :shuffle2: как убрать косяк к в темах записей, когда длинная тема и наезжает на кол-во тем, т.е. укоротить тему с многоточием ("жизнь ретроградного оптимиста" -> "жизнь ретроградного..."). и как можно картинки заставить уменьшаться автоматически до 500 пикс. в ширину? :hmm: #JournalFavorite img {width: 500px; height: auto;} не помогает, потому что тогда разносит смайлики и значки "редактировать" и т.п. тоже до 500 пикселей. @_@

2015-01-09 в 11:44 

Ренос
Тесты, просто тесты.
а не подскажите, плиз, как примерно код должен выглядеть? %)
#tagslistlink:after {content: ""; position: absolute; top: 10%; left: 10%; height: 100px; width: 100px; background: white}
Блок с надписью можно вынести куда-то за пределы экрана, чтобы он глаза не мозолил, и на его место воткнуть блок (типа того, что выше) с картинкой. Клики по этому блоку будут отрабатываться так же, как и клики по блоку с надписью, т.е. точно так же будет вылезать менюшка.

да-да-да. видела дизайны, где аватарки красиво так уменьшены до 50px ))
#thisDiaryPhoto {max-width: 50px; max-height: 50px}

4.1. Точно так же, как вы имя сдвинули:
.sign {position: relative; left: 150px !important; top: -50px !important;}
4.2. Без понятия почему не работает. Единственное, что в голову приходит - надпись перекрыта сверху каким-то другим прозрачным блоком, поэтому на неё и нажать не удаётся. Попробуйте у ".authorName a" z-index по-больше прописать.

как убрать косяк к в темах записей, когда длинная тема и наезжает на кол-во тем, т.е. укоротить тему с многоточием ("жизнь ретроградного оптимиста" -> "жизнь ретроградного...").
Никак. Через стили можно разве что саму менюшку шире сделать, чтобы всё влезало.

и как можно картинки заставить уменьшаться автоматически до 500 пикс. в ширину?
#JournalFavorite img {max-width: 500px; max-height: auto}
Так попробуйте.

2015-01-09 в 12:46 

SnezhArt
ретроградный оптимист
Ренос, сейчас попробую поколдовать с темами ))
#thisDiaryPhoto {max-width: 50px; max-height: 50px}
значит также как и в 100 делается. спасибо ))
Точно так же, как вы имя сдвинули:
сдвигаю. но тогда подпись пропадает совсем куда-то. ее вообще нет. оО

2015-01-09 в 13:06 

Min Young-nim
Don't try to be original, just try to be good.
SnezhArt, как убрать косяк к в темах записей, когда длинная тема и наезжает на кол-во тем, т.е. укоротить тему с многоточием
Задаёшь ширину #TagsList ul a и добавляешь overflow: hidden; text-overflow: ellipsis;
Вот и весь фокус-покус.

2015-01-09 в 13:08 

Min Young-nim
Don't try to be original, just try to be good.
#JournalFavorite img {max-width: 500px; max-height: auto}
Лучше уж тогда #JournalFavorite .paragraph img {max-width: 500px; height: auto;}
Чище будет.

2015-01-09 в 13:28 

SnezhArt
ретроградный оптимист
Min Young-nim, уменьшение картинок получилось. спасибо!!
а вот Задаёшь ширину #TagsList ul a и добавляешь overflow: hidden; text-overflow: ellipsis; проделала и ноль реакции. :hmm:

2015-01-09 в 13:31 

Min Young-nim
Don't try to be original, just try to be good.
SnezhArt, добавь display: inline-block;, поможет)

2015-01-09 в 13:50 

SnezhArt
ретроградный оптимист
Min Young-nim, вааа. помогло. ** ты просто ангел спасения. х)

2015-01-09 в 13:54 

Min Young-nim
Don't try to be original, just try to be good.
SnezhArt, ну дык, я уже очень давно этой штукой пользуюсь)

2015-01-09 в 13:59 

SnezhArt
ретроградный оптимист
Min Young-nim, а можно тогда тебя еще помучить вопросами? )

2015-01-09 в 14:02 

Min Young-nim
Don't try to be original, just try to be good.
SnezhArt, смотря какими, можешь попробовать покидать их в умыл)

2015-01-09 в 14:05 

SnezhArt
ретроградный оптимист
Min Young-nim, окей )

2015-01-09 в 17:04 

Тайя, которая душит романтиков
Не говорите так быстро, я не успеваю класть х*р на ваши слова.
в черновиках по-прежнему какой-то дикий отступ есть
SnezhArt, #JournalDraft .paragraph {margin: 0 !important;}
У вас параграфу задан отступ, надо его перебить именно для черновиков.

У вас вот что еще: Добавить в Избранное и Краткое избранное наложились друг на друга. У вас наверное, отображение "Краткого избранного" отключено и вы его не видите? Отрубите его с помощью #mySFavLink {display: none;}

2015-01-09 в 17:29 

SnezhArt
ретроградный оптимист
Тайя, которая душит романтиков, Добавить в Избранное и Краткое избранное наложились друг на друга
ооо. спасибо, что заметили!! у меня и правда оно отключено. ))

2015-01-09 в 18:16 

Ренос
Тесты, просто тесты.
сдвигаю. но тогда подпись пропадает совсем куда-то. ее вообще нет. оО
Точно. Заползает под другой блок и я совершенно без понятия, как его оттуда выудить. Опыта работы с CSS пока маловато :(

2015-01-09 в 18:19 

Min Young-nim
Don't try to be original, just try to be good.
А чего с подписью-то не так?
Задать ей какой-нибудь display: block, например, ширину, высоту, абсолютное позиционирование и двигай как хочешь. position: relative тут не товарищ. Для наглядности можно временно обвести рамкой. Ещё можно осторожно потыкать родительский блок.

2015-01-09 в 18:42 

SnezhArt
ретроградный оптимист
Ренос, я уже выудила. )

Min Young-nim, я как раз сейчас работаю над ней. ))

2015-01-09 в 20:06 

Ренос
Тесты, просто тесты.
Min Young-nim, не помогает ни относительное, ни абсолютное. Там вообще какая-то мистика. Через Инспектор Огнелиса можно увидеть, где этот блок находится. Но сам блок не видно. Я даже смещал его влево почти до края экрана, где только фон от body, так этот блок и там не отображается.

SnezhArt, никак?

2015-01-09 в 20:26 

SnezhArt
ретроградный оптимист
Ренос, та же фигня. )) я уже и в одну строку, и ширину, и высоту, дисплей блок, и рамку дала, но да, его видно через firebug, но без него просто невидимка какая-то. х)
у меня скорее всего где-то лажа, просто ее надо отыскать ><

2015-01-09 в 20:26 

Min Young-nim
Don't try to be original, just try to be good.
Ренос, ну, значит, я повелитель всего магического и мистического.
Просто нужно добавить .commentAuthor {overflow: visible;}
Т.к. это родительский блок для .sign, и по умолчанию всё, что выходит за его границы, скрывается.

2015-01-09 в 20:35 

SnezhArt
ретроградный оптимист
Min Young-nim, ну, значит, я повелитель всего магического и мистического.
я вот даже не сомневалась. так что после overflow: visible; шапка-невидимка снялась :-D

2015-01-09 в 20:35 

Ренос
Тесты, просто тесты.
Заработало :)

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

2015-01-09 в 22:05 

Min Young-nim
Don't try to be original, just try to be good.
Ренос, это не фигня, а необходиомость, некоторыелюдилюбятписатьвоттак, без пробелов. Если не прописать это свойство, то подпись будет перекрывать текст длинных комментариев. Просто нужно подумать, почему блок обрезается, если его ничто не перекрывает. Логика — самая могущественная магия в мире.

2015-01-09 в 22:22 

SnezhArt
ретроградный оптимист
Min Young-nim, как ты думаешь, почему страница календаря может вообще не реагировать на изменения? :hmm: я вроде ничего преступного ей не прописываю, но она не хочет даже бэкграунд делать белым.

2015-01-09 в 22:29 

Min Young-nim
Don't try to be original, just try to be good.
SnezhArt, так вроде ж он белый?

2015-01-09 в 22:32 

SnezhArt
ретроградный оптимист
Min Young-nim, все. это похоже мне уже пора спать идти. %) стояла лишняя скобка открытая, я ее забыла удалить, ну и все служебные страницы слетели. :facepalm:

2015-01-09 в 22:35 

Min Young-nim
Don't try to be original, just try to be good.
SnezhArt, бгг, ох уж эти коварные скобки %)

2015-01-09 в 23:00 

Ренос
Тесты, просто тесты.
Min Young-nim, очень сомневаюсь, что лично мне будет интересно мнение человека, не признающего такое достижение цивилизации, как пробел. Да и как вы себе вообще представляете длинное сообщение без пробелов? Очень сомневаюсь, что вы или кто-либо ещё хотя бы пару строчек этой монолитной писанины осилите. Так что считаю это ограничение надуманным и даже вредным, потому как из-за нескольких малолеток вынужденны страдать люди, желающие подогнать дизайн под себя, но не являющиеся специалистами в данной области.
А логика будет работать только в том случае, если человек изначально осведомлён о подобных возможностях и когда-то применял их на практике.

И если вы всерьёз считаете, что это было сделано именно из-за этого, то почему был использован именно overflow, а не text-overflow? Тогда бы без дополнительных манипуляций и блок можно было таскать куда угодно, и словофразы резались бы.

2015-01-09 в 23:28 

Min Young-nim
Don't try to be original, just try to be good.
Ренос, И если вы всерьёз считаете, что это было сделано именно из-за этого, то почему был использован именно overflow, а не text-overflow?
Я думаю, это вопрос уже не ко мне.
Так что считаю это ограничение надуманным и даже вредным
Это не ограничение, а всего лишь свойство. Блок не бумажный, обрезан не ножницами и не навсегда. Всё можно изменить.
Засим откланиваюсь, т.к. с таким подходом тут разовьётся целая драма и даже будет пара жертв. А потом придёт Эркюль и всем накостыляет за оффтоп.

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

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

главная