antything in this challenge
What challenges did you encounter, and how did you overcome them?validation
What specific areas of your project would you like help with?none atm
I didn't pay much attention to HTML/CSS while doing this assignment. More interested in the JS part
What challenges did you encounter, and how did you overcome them?lack of access to the layout, because of this I did some things by eye
What specific areas of your project would you like help with?not any
I like implementing the grid in the tablet view to follow the design layout.
What challenges did you encounter, and how did you overcome them?The grid items' alignment was somehow strange as it is opposite to the alignment implementation in Flexbox.
What specific areas of your project would you like help with?nope
Being able to apply the grid
What challenges did you encounter, and how did you overcome them?working through the root
What specific areas of your project would you like help with?grid
Mostly I am proud of the mobile page I made using media query. It was a fun experiment that ended up working just like I intended.
@media only screen and (max-width: 480px) {
body {
margin: 0;
}
main {
width: 100%;
margin: 0px;
border-radius: 0%;
padding: 0 0 30px;
}
img {
display: block;
border-radius: 0%;
margin: 0;
width: 100%;
height: auto;
}
}
Next time I would try to shorten the style.css, as it got quite long.
What challenges did you encounter, and how did you overcome them?First I had problems with getting the main element to display properly. The problem was solved when I realised I had set the page height too small.
The next major problem was with the mobile page. I couldn't get the image to display at the top of the page, but ultimately I just had to tweak padding and margins a bit.
the responsive of my design
What challenges did you encounter, and how did you overcome them?to Add that kind of solid black shadow for the card
What specific areas of your project would you like help with?About size of my card
to center the image do not use position absolute i would rather use flex or sth like thatbody { min-height: 100vh; display: grid; place-items: center; }
Very simple solution to the challenge. A great study opportunity.
What challenges did you encounter, and how did you overcome them?I encoutered challenges with varaibles. But it was ok.
What specific areas of your project would you like help with?Improve to be as closer as possible to the original.
