<div class="container"> Etiketi & CLS Sorunu

10-09-2022, 02:07:34

Merhaba arkadaşlar. Bu kodun (<div class="container">) altına herhangi bir şey koyduğumda, pagespeed üzerinde CLS sorunu alıyorum. Açık açık CLS sorununun <div class="container"> olduğunu söylüyor. Bunu nasıl düzenleyebilirim? Bilgisi olan var mı?

10-09-2022, 02:25:37

#2

trojanhorse

takipteyim

10-09-2022, 13:34:43

#3

Misafir

başta bu class olmak üzere alt ve üst div classların css kodlarına bakın.
muhtemelen margin,padding ve pozisyon kodları gibi yerler kaydırma yaratıyodur.

yakupbeyaz bunu beğendi.

1 kişi bunu beğendi.

10-09-2022, 16:38:26

#4

yakupbeyaz

Misafir adlı üyeden alıntı: mesajı görüntüle

başta bu class olmak üzere alt ve üst div classların css kodlarına bakın.
muhtemelen margin,padding ve pozisyon kodları gibi yerler kaydırma yaratıyodur.

Hocam kaydırma yapmaması için nasıl bir css kodu eklemeliyim?

10-09-2022, 23:43:35

#5

TechnicaL35

Sorununuz muhtemelen <div class="container"> kodunun altındaki başka bir kod yığınından kaynaklı, bütün kodları görmeden bir şey demek çok zor.
CLS sorununun oluşmasına sebep olan farklı sebepler vardır.

CLS Visualizer eklentisini Chrome tarayıcınıza kurun ve siteniz açıkken eklentiyi tıklayarak çalıştırın. Sitenizdeki CLS sorunlarını listeleyecek ve birini seçtiğiniz zaman animasyonlu bir şekilde kırmızı bir alanın içine alacak.
O kırmızı alana sağ tıklayıp ''öğeyi incele/denetle'' seçeneğine tıklarsanız sizi direkt CLS sorunu olan kod satırına götürecektir.

12-09-2022, 22:11:23

#6

yakupbeyaz

TechnicaL35 adlı üyeden alıntı: mesajı görüntüle

Sorununuz muhtemelen <div class="container"> kodunun altındaki başka bir kod yığınından kaynaklı, bütün kodları görmeden bir şey demek çok zor.
CLS sorununun oluşmasına sebep olan farklı sebepler vardır.

CLS Visualizer eklentisini Chrome tarayıcınıza kurun ve siteniz açıkken eklentiyi tıklayarak çalıştırın. Sitenizdeki CLS sorunlarını listeleyecek ve birini seçtiğiniz zaman animasyonlu bir şekilde kırmızı bir alanın içine alacak.
O kırmızı alana sağ tıklayıp ''öğeyi incele/denetle'' seçeneğine tıklarsanız sizi direkt CLS sorunu olan kod satırına götürecektir.

Teşekkürler hocam