Nft card preview - Flexbox and :hover

Hello @DvD83130 ,

I have some suggestions regarding your solution:

• Using landmark elements , you can improve the navigation experience on your site for users of assistive technology . So you can use<main> to wrap the body content

• Links must have discernible text . you can have the main image Equilibrium in the html .

• For any decorative images, each img tag should have empty alt="" andaria-hidden="true"attributes to make all web assistive technologies such as screen reader ignore those images as in alt="icon-ethereum" , alt="icon-ethereum" Read about how and when to write image alt text and what it's for..

• It's invalid html to wrap a heading element in an anchor tag. Swap those around so the anchor is inside the heading.

• Do not include a prefix such as "profil-author-pictures" the screen reader will communicate the fact that this element is an image as it has been coded as such. You can useJules Wyvernas alt text .

• You can use flexbox properties and min-height to the body( not height )to center the component on the middle of the page.(no need for position absolute)

{
display: flex;
align-items: center;
justify-content : center ;
width: 100%;
min-height: 100vh
}

• Never have font size in px. Using px won't allow the user to control the font size based on their needs.

• Use max-width instead of width. Then a little margin on the component or padding on the body to stop it hitting screen edges

Hopefully this feedback helps.

Duuude !!! thanks a lot for your comment ;) I Love it, many goods suggestions. You improve my knowledge, just perfect.