Создание параллелограмма через transform?

Question

[S_Tigrov]

Я добавляю параллелограмм с текстом через псевдоэлемент before
Параллелограмм делаю через свойство transform, но вместе с блоком искажается и текст внутри него(
Как сделать чтобы текст не наклонялся вместе с блоком?

Comments

[Rustam Bainazarov]

Обратное трансформирование текста с помощью transform в обратную сторону. Или делать трансформируемый элемент на отдельный блок.

[S_Tigrov]

Рустам Байназаров, я добавляю блок псевдоэлементом, там же можно работать только с одним блоком

[Rustam Bainazarov]

S_Tigrov, ну а я откуда это знаю? Вы нигде это не указали, как и не привели пример своего кода.

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

[S_Tigrov]

Рустам Байназаров, я написал про это в самой первой строчке

[Rustam Bainazarov]

S_Tigrov, возможно, не заметил, если не меняли текст вопроса.

В любом случае, когда элемент один, тем более текст через before — это невозможно.

Выносите текст в отдельный элемент/псевдоэлемент. Делайте фигуру фоном. Но transform вы не сможете отменить ни для content псевдоэлемента, ни для textContent, если это был нормальный текст внутри блока. Текст в любом случае нужно выносить в отдельный блок.

[S_Tigrov]

Рустам Байназаров, спасибо, щас попробую

[Дмитрий Баскаков]

Текст через :after, а параллелограмм через :before

Answer 1

[strelok011]

jsfiddle.net/JoshC/53FrA