Make the table of contents appear above the article image on mouseover.

The additional CSS class filed doesn't need to add a dot in front of the class name.

Can you share admin access to your site, as I can see you've been adding the class .blog-dynamic-content to other containers which is not right.

Please use the private info field for sensitive info like login details.

certainly, how can I share access to you?

Use the private info field.https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

ok

[Sensitive info is removed by admin]

I've updated your block element, have a look.

On front end, only the 1st and 7th posts are working because they are the only posts have text content.

thank you so much, can you explain to me what the .blog-dynamic-content is for?

Imaging .blog-dynamic-content is a name you give to the container block which holds the text (dynamic content block).

So in the effect, we set:
1. In normal state of the parent container, the .blog-dynamic-content is set to transparent (opacity: 0;).

2. In the hover state of the parent container, the .blog-dynamic-content is set to show (opacity: 0.9;).

sorry, I mean blog-dynamic-content in Additional CSS class (s).
what is its use?

I have explained it here:
https://generatepress.com/forums/topic/make-the-table-of-contents-appear-above-the-article-image-on-mouseover/page/3/#post-2090206