How I can remove the CLS from a html-element? I have inserted an image with text via html in my sidebar: https://www.topfgartenwelt.com/feiner-luftiger-schokoladen-gugelhupf-mit-butter-aus-dr-oetker-schokoladenkuchen –> Topfgartenwelt (Text) and than the image is loaded. But there is no container for the image so a shift occurs.
The code is:
<center><div class=”item-details”><div class=”td-author-name”>Topfgartenwelt</div></div>
</center>
Can I use a container like that: <div style=”width:300px; height:250px;”>
<!– your ad –>
</div>?
EDIT: I have tried that kind of container but it makes no difference to the CLS because the image is loaded to late and the container has no function as a placeholder… What would be the code for an effective placeholder for the image?
Greetings Kathrin
Hi,
As I can see you are using the html code as in this guide -> https://www.w3schools.com/tags/tag_img.asp if this is causing CLS then I do not know other way to set an image, maybe only if you set it as a background image -> https://www.w3schools.com/cssref/pr_background-image.asp but I do not thing this will work
I will make some more investigation for this problem.
Thank you!
Dear Calin, the CLS seems to be gone.
Greetings Kathrin
Hello @huma1985,
Please check this topic about page speed https://forum.tagdiv.com/topic/why-is-my-websites-mobile-google-test-slow/
Hope this helps you!
Thank you!
