Hello everyone! This is my first challenge on Frontend Mentor. I'm a newbie in frontend development and I am self-taught.
I think I did a good job but I had some difficulties on center the image on the card div with bootsrap and css.
This is good solution. But, I have some suggestion for you.
First of all, you haven't used any semantic tags. For example, <main>, <footer> etc.
This tags important for all websites. Because, websites must be visible by search engines. Therefore, we should use this tags.
This change will make your codes more semantic.
It's very good solution but I have some suggestions for you.
First of all, you can use <main> tag instead of <section>. This change will make more semantic your codes.
In addition, you don't need these css codes:
section {
display: flex;
flex-direction: column;
justify-content: space-around;
}
can u pls tell me what i was doing wrong ? i couldnt make the page responsive .
Hi Barış,
You couldn't make responsive for this site. Because, you didn't add true media query codes.
For example. In the responsive design, you should change the picture position. Picture must be top of the card content. Therefore, you should add this codes:
#box-1 {
display: block;
/* flex-direction: column both are possible*/
}