Как я могу вращать как текст, так и его контейнер?

Question

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

Если я поверну его как обычно, это приведет к следующему: http://jsfiddle.net/lumio/a3Z4C/
Как видите, текст вытекает из контейнера, но я хочу, чтобы он был внутри него.
Поэтому не весь текст должен поворачиваться, а строки, которые затем должны быть выровнены по контейнеру.

Кто-нибудь знает решение с помощью CSS или JS?

С наилучшими пожеланиями

Answer 1

Вы динамически рассчитываете вращение? Если это так, вы можете динамически добавить некоторые отступы в контейнер. Не уверен, какой будет точный алгоритм, но это будет что-то вроде P = (D * N)

P = заполнение, D = градусы, N = магическое число, чтобы все это работало:)

Answer 2

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

/ jsfiddle.net / smitdesai / dsvUS /

Answer 3

Если вы добавите несколько отступов в контейнер div, текст будет плавно перетекать внутрь блока. Я добавил как минимум 10 пикселей в ваш пример jsFiddle, и текст находится прямо внутри контейнера. Однако может показаться, что лучше добавить немного больше отступов, как показано ниже:

.container {
    width: 300px;
    background: silver;
    margin: 20px;
    padding: 10px;
}