Bir kapsayıcıyı ölçeklenmiş (veya başka bir şekilde dönüştürülmüş) içeriğine göre ölçeklendirebilir miyim?

Question

İçinde, bir ölçek dönüştürme uygulandığında karmaşık içeriğin oluşturulduğu bir var. Benim sorunum, 'un hiçbir dönüşüm uygulanmamış olsa bile alacağı alanın aynısını almasıdır. Ne demek istediğimi göstermek için bir jsFiddle snippet yaptım.

I think I can understand why the behavior is like this ancak uygulandığı (mümkünse ve diğer dönüşümler) konteyner olarak ölçekleme ile içeriği kadar yer kaplıyor böylece yapmak için herhangi bir yolu var mı?

Bunu açıkça dışında ölçekli metnin içeriğini etkiler <div> ait width ve height ayarı (ve bu benim durumumda davranışı istenen değildir) dikkat edilmelidir. Ölçeklendirilmiş içeriğin bir içine koyulması, kaçınmak istediğim bir şeydir.

Answer 1

Javascript'e başvurmadan, bunu yapmanın bir yolu yoktur, sanmıyorum. CSS dönüşümleri, dönüştürülmüş öğelerin yakınındaki elemanlar için düzen akışını etkilemez, yalnızca bu öğedeki koordinat sistemini değiştirir; Bu nedenle çocuklar etkilenir, ancak ebeveynler veya kardeşler değil (MDN bu konuda daha fazla ayrıntıya sahiptir).

Orada sizin için JS tabanlı kısmi çözüm olabilir burada büyük cevabı: (Chrome 27/Firefox 22) https://stackoverflow.com/a/10913299/2524360

Answer 2

Sorunun yanıtı olup olmadığını bilmiyorum, ancak 0 değerini bir değer olarak kabul etmiyor gibi görünüyor. Tarayıcılar 1'den 100'e kadar, örn. 4 veya% 400.

transform:scale(1,4);