Bir chrome css problemi

merhaba arkadaşlar bir site yapıyorum ancak sorun yaşıyorum nedenini bulamadım gözden kaçırdığım birşeymi var acaba

Site bilbul.net

site firefox da sorunsuz şekilde konu üstüne gelince resim rotate oluyor ancak chrome da üstüne gelince yine rotate oluyor ancak resim kesiliyor.

Bir çok deneme yaptım ama sorunu bulamadım yardımcı olursanız sevinirim.

style.css 60. satır

.konular figure classındaki overflow:hidden i kaldır.

bu arada

columb-break-inside kullanımı chrome tarayıcı için yanlış, bunu şu şekilde değiştirin.

-webkit-column-break-inside: avoid;

Aynı satır CSS için

animation-fill-mode:none;
-webkit-animation-fill-mode:none;

kodlarını eklersen verdiğin animasyon sonrası elementin duruş halini belirlersin, senin class'ında bu both; olarak verilmiş, buna herhangi bir değer vermezsen Chrome daki durum düzelir. Ayrıca overflow:hidden; i animasyon verdiğin elemente değil, onun kapsayıcı katmanına vermen gerekiyor, yani bir üst li veya div e vermen gerekiyor.

.konular figure kısmındaki overflow'u kaldırınca resim rotate olurken sağa ve sola taşıyor onu engellemek için verdim onu ama dediğiniz değişiklikleri yaptığım halde chrome daki sorun hala çözülmedi hocam

--R10.NET; Flood Engellendi -->-> Yeni yazılan mesaj 16:53:53 -->-> Daha önceki mesaj 16:49:20 --

Pardon yanlış yere eklemişim sanırım oldu teşekkürler.

--R10.NET; Flood Engellendi -->-> Yeni yazılan mesaj 17:54:56 -->-> Daha önceki mesaj 16:53:53 --

Yok olmadı hocam en son eklenen resimde sorun yok ama diğerleri şimdi tamamen kayboluyor

overflow:hidden; i resime değil onun üstündeki kapsayıcıya ver (li veya div)

benim şahsi fikrim, sadece rotate olacak bir animasyon için gerekli gereksiz bir sürü kod yazmışsın, bence kodlarını temizleyip veya boş bir html sayfasında transform: rotate(); uygula, sonrasında efect ve süre verirsin.

-webkit-backface-visibility: hidden;

Eklenmesi gerekmektedir.