Вставить цитату

[Элья Бронски]

Разбираюсь в css (в основном, методом проб и ошибок, поскольку все, что когда-то учила в вузе на эту тему, забыла напрочь, увы).
Столкнулась с непонятным мне поведением кода, подскажите, что я делаю не так и куда копать.
Это оформление цитат в постах\коментах. Код пока честно уволокла из тьюториала как раз-таки по цсс (на просторах дайри), просто так насильно в пост в виде div прекрасно впихивается и работает (первая картинка - это именно так, в отдельном посте, а не через цсс для всего дневника)

надо примерно так

Хотя, конечно, такие адские отступы мне не нужны от окружения цитаты (другого текста, то бишь).

а получается так

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

 .quote_text { text-align=auto; padding: 20px; border-radius: 15px; border: 5px solid #E0E1E9; background-color: #ffffff;opacity: 0.7; width: 350px; box-shadow: 0 0 20px rgba(0,0,0,0.8);"}

Заранее благодарю.

@темы: рамки и полоски

Comments

[Aurus]

Элья Бронски, не уверена, насколько это поможет, но, во-первых, попробуйте в text-align знак равно заменить на двоеточие, а во-вторых - убрать кавычку перед закрывающей скобкой в конце, она там точно не нужна )

[Элья Бронски]

Aurus, благодарю. с т.з. чистоты и грамотности кода, вы правы, конечно, я что-то проглядела это дело). Однако по существу вопроса, увы, "не прокатило" (©тарый анекдот).
Видимо, загвоздка еще где-то. либо там конфликт с другими частями кода. Буду еще копаться.

[Aurus]

Элья Бронски, да не за что, иногда просто такие мелочи ускользают от взгляда, и никогда не знаешь, как они повлияют на отображение) жаль, что не помогло; тогда другая идея - попробуйте добавить "display: block;", я сейчас проверила, по идее, должно заработать правильно )

[~Erika]

Элья Бронски, добавьте следующий код:

.blockquote {
    padding: 20px;
    border-radius: 15px;
    border: 5px solid #E0E1E9;
    background-color: #ffffff;
    opacity: 0.7;
    box-shadow: 0 0 20px rgba(0,0,0,0.8);
}

[Элья Бронски]

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

[Элья Бронски]

~Erika, спасибочки, попробую

[~Erika]

Не заметила комментария Aurus)) Так тоже можно. Либо display: block для .quote_text, либо все эти свойства писать для .blockquote.

[Элья Бронски]

~Erika, что-то все ж таки не клеится: ваш вариант вообще не действует(. А вот если вместо blockquote ставлю quote_text, получается ровно тоже, как на моей второй картинке (которая "как не надо"). Мистика.
Попробую display: block впихнуть. Бедные ПЧ, если там кто-то пробегает в эти моменты))

[Элья Бронски]

UPD Ура! Сработал "костыль" display: block. Спасибо за подсказки.
в итоге так теперь:

 .quote_text {display: block !important;}
 .quote_text {padding: 20px !important; border-radius: 15px !important; border: 5px solid #E0E1E9 !important; background-color: #ffffff !important; opacity: 0.7 !important; box-shadow: 0 0 20px rgba(0,0,0,0.8) !important;}

На !important внимания не обращайте, в противном случае, половина желаемого не работает, из-за конфликта с примененным каталожным дизайном.

[~Erika]

Элья Бронски, в Вашем же дневнике пробовала, работало))
В любом случае, хорошо, что всё получилось))

[Элья Бронски]

~Erika, говорю же - мистика)). Главное, сработало в итоге)). Осталось набраться смелости и написать нормальный код начисто, без костыликов, налепленных на чужие творения). Еще раз спасибо.