Looking to hire developers?
@SameerJS6
@LiarleyCodie
Submitted
This project was the first time I used the fetch method to fetch data from a local JSON, and also the first time I happened to need to use methods like async and await (this time I saw the md file that contained the fonts and the colors) :)
@SameerJS6
Posted
Congratulations on completing this fun, beautiful Project.
alt=Whatever the image is about on img tag is necessary because, In case if the user doesn't have a good internet connectivity, then it show this text instead of the image. So describe it short and simple.@moofath
Submitted
Please help me to review my coding, I will accept all suggestions from all of you. Thank You
@SameerJS6
Posted
Congratulations on completing this little fun challenge and you have done a great job.
Good Luck!!!
@matthew-millard
Submitted
Is the correct way to center the component both horizontally and vertically as the contents are overflowing the viewport height? I set the top: 0; applied equal padding on both top and bottom and set translate(-50%, 0).
position: absolute;
top: 0;
left:50%;
transform: translate(-50%, 0%);
padding: 2rem 0;
width: 90%;
max-width: 400px;
margin: 0 auto;
display: grid;
grid-template-columns: 100%;
grid-template-rows: auto;
grid-template-areas:
'sedans'
'suvs'
'luxury';
}```
@SameerJS6
Posted
The problem your facing is very basic that anyone can face, but to solve it all you have to do is use the modern solution to align content i.e. css display: grid or css display: flex. But the nonetheless, below is the solution for your problem
Here is the solution,
body {
display: grid;
min-height: 100vh;
place-content: center;
}
h1 {
color: black;
text-align: center;
visibility: visible;
}
main {
padding: 1rem;
max-width: 900px;
margin-inline: auto;
}
.cards {
display: grid;
}
@media (min-width: 768px) {
.cards {
grid-template-columns: repeat(3, 1fr)
}
Then adjust the column's border-radius according to the layout i.e. either for mobile or desktop
Marked as helpful
@PaulaR-05
Submitted
Here is my solution to the NFT preview card component solution ✨ I still find it challenging to understand all the best practices for CSS/HTML, so ...any tips for it?
😊 Happy to hear any feedback and advice. Thanks!
@SameerJS6
Posted
"Nice one, buddy, but you forgot to add hover effects on the link tags (Creators Name, Price) and on the main image. You also forgot to add a cursor: pointer to some links. Always make sure to decrease the heading tag only by one. For example, if you have used h1, you should not use h4 directly on the page; it should only decrease one by one."
Thank You,
Marked as helpful
@dev-mohieb
Submitted
Created using Tailwind CSS. Took me about 4 days to finish everything up.
I'm not sure if my JavaScript code is up to standard but it's the best I can do at my current level.
I was also going to add accessibility to the app but I got really frustrated while writing the JavaScript and I just wanted to finish the project asap.
Any advice is appreciated, this is all self-taught!
@SameerJS6
Posted
Nice one there brother, and also congratulations on your achievement in completing this project.
But work on the Reset Button functionality, it reset the tip percentage active class but doesn't actually remove the selected value, so make sure to leave the active or selected class active.
And also the give the body a min-height: 100vh; to center the whole application center proper. Thank you!!
@correlucas
Submitted
👾 Hello, Frontend Mentor coding community. This is my solution for the Fylo Data Storage Component.
This challenge was really challenging, was really tricky to create the pop up and position some elements. Was really fun to create the logo and customize the design, I am happy with the design output but not with the code, once I finish the remaining HTML/CSS challenges I'll focus on it!
🎨 I added some custom features:
🍚Follow me in my journey to finish all HTML/CSS only challenges (Only 3 missing)! Gotta Catch ’Em All
Ill be happy to hear any feedback and advice!
@SameerJS6
Posted
I loved the color scheme and Gradient in it.!!.. But a minor change (i.e its 1000GB or 1TB, not 100GB)...
Marked as helpful
@folaa01
Submitted
First javascript project, thought I won't be able to do it but tried it... Will be glad to get feedbacks.
@SameerJS6
Posted
Well nice one brother, must have felt good but you missed the color of Thank You (It's white, not black)
