Programmazione css-transforms

7

Come applicare più trasformazioni nei CSS?

Utilizzando i CSS, come posso applicare più di uno transform? Esempio: Di seguito viene applicata solo la traduzione, non la rotazione. li:nth-child(2) { transform: rotate(15deg); transform: translate(-20px,0px); }

605 css css-transforms

10

'transform3d' non funziona con la posizione: figli fissi

Ho una situazione in cui, in normali circostanze CSS, un div fisso sarebbe posizionato esattamente dove è specificato ( top:0px, left:0px). Questo non sembra essere rispettato se ho un genitore che ha una trasformazione translate3d. Non vedo qualcosa? Ho provato altre trasformazioni di webkit come lo stile e le opzioni …

140 html css css-position css-transforms

6

Elementi ruotati in CSS che influenzano correttamente l'altezza del genitore

Diciamo che ho un paio di colonne, di cui alcune vorrei ruotare i valori di: http://jsfiddle.net/MTyFP/1/ <div class="container"> <div class="statusColumn"><span>Normal</span></div> <div class="statusColumn"><a>Normal</a></div> <div class="statusColumn"><b>Rotated</b></div> <div class="statusColumn"><abbr>Normal</abbr></div> </div> Con questo CSS: .statusColumn b { writing-mode: tb-rl; white-space: nowrap; display: inline-block; overflow: visible; transform: rotate(-90deg); transform-origin: 50% 50%; } Finisce per assomigliare …

119 css css-transforms

4

Ruota e traduci

Ho dei problemi a ruotare e posizionare una riga di testo. Ora è solo la posizione che funziona. Funziona anche la rotazione, ma solo se disabilito il posizionamento. CSS: #rotatedtext { transform-origin: left; transform: rotate(90deg); transform: translate(50%, 50%); } L'html è solo testo semplice.

90 css webkit transform css-transforms

4

Come posso curvare una linea nell'animazione CSS "montagne russe"?

Sto cercando di creare un'animazione in stile montagne russe con CSS. Voglio sapere come curvare il "sottobicchiere" quando è nella fase del ciclo. Sto cercando una soluzione tutto CSS, ma se c'è bisogno di un po 'di JavaScript, sono d'accordo. il mio codice finora: #container { width: 200px; height: 300px; …

15 html css css-animations css-transforms

Domande taggate «css-transforms»