Monica I.
@monicaivanovAll comments
- @dominguez-danielSubmitted 3 months ago@monicaivanovPosted 3 months ago
I love your code, very logically structured, easy to read and a lot to learn from. Good job!
0 - @fsahinbasSubmitted 3 months ago@monicaivanovPosted 3 months ago
Good job on this challenge! The result looks great. I think the only thing missing is some margins top/bottom, left/right for the whole structure. It will make it look better even in mobile view.
Marked as helpful0 - @EfelipaSubmitted 3 months agoWhat are you most proud of, and what would you do differently next time?
Discover the relative typography using "vw", in extremely useful.
What challenges did you encounter, and how did you overcome them?Typography was an issue and adapt the responsive view.
@monicaivanovPosted 3 months agoCongratulations on finishing the challenge! Your code is easy to read and the result looks wonderful. Nice job with the flexbox. You can try to use picture element with srcset attribute for the main image (with the 2 versions - mobile and desktop), it will cut down the code in CSS.
Marked as helpful0 - @JJorgeMS13Submitted 4 months agoWhat are you most proud of, and what would you do differently next time?
Me encantaría tener mas experiencia en mejores practicas para desarollo tanto html como css
What challenges did you encounter, and how did you overcome them?Hacer que la tabla tuviera un buen diseños, lo supere buscando en ChatGPT, donde encuentras muy buenos ejemplos y bien explicados en este caso lo que hice fue darle diseños a las tr y td para que tuvieras diseños indenpiendes use pseudoclases
What specific areas of your project would you like help with?me encantaría recibir ayuda con mejores practicas de desarrollar para que mi codigo sea lo mas limpio posible.
@monicaivanovPosted 4 months agoHi, I like your code solutions, very well done. This project was a lot of work :-) . My suggestion is to use less classes in your HTML structure since the design is pretty consistent. This will also help you in the CSS file - you will have less selectors to stylize.
Enjoy coding!
Marked as helpful0 - @simgeduruSubmitted 4 months agoWhat are you most proud of, and what would you do differently next time?
I coded faster than the previous time.
What challenges did you encounter, and how did you overcome them?I had a hard time adjusting the shadow size for phone and desktop. I solved it with the media query.
What specific areas of your project would you like help with?how can I adjust the shadow size without the need for media query? thank you for your help
@monicaivanovPosted 4 months agoHi, for box shadow I used box-shadow property: box-shadow: 10px 10px rgba(0, 0, 0, 0.497);
I like a lot css-tricks website: https://css-tricks.com/almanac/properties/b/box-shadow/.
Happy coding!
Marked as helpful0 - @darshan744Submitted 4 months agoWhat are you most proud of, and what would you do differently next time?
Just practisigmy html basic and css basic
What specific areas of your project would you like help with?Writing CSS as it has many properties and has effects which aren't known to a beginner.I would appreciate some help in CSS.
@monicaivanovPosted 4 months agoHi, I think would be more helpful and easy to read your code if you put the CSS into a different file (style.css) and link it to your HTML file. For using the flexbox or other ways of centering block elements I recommend this article: https://css-tricks.com/centering-css-complete-guide/ . Check the grid option (last one on the page), its so clean and easy. You can find other useful articles under Guides menu.
You did a great job. Keep coding!
0 - @marynaKolikovaSubmitted 4 months ago@monicaivanovPosted 4 months ago
Hi, very nice result. Your solution includes semantic HTML, the design is resizable on different screen sizes and I like your personalization of the hand cursor. My only small suggestion is to try to use more relative measures and less pixels, it makes life easier. Congratulations and happy coding!
0 - @Baegan-189Submitted 4 months ago@monicaivanovPosted 4 months ago
Hi, your design looks awesome!! Nice work. You accomplished the design requirements. I think the next "challenge" is to try to use less fixed sizes (pixels measurements) and more relative values. It will help you to have a more responsive design.
I recommend this article: https://css-tricks.com/centering-css-complete-guide/. It gives you practical solutions.
Enjoy coding! Monica
0 - @Rui-Martins23Submitted 4 months agoWhat are you most proud of, and what would you do differently next time?
Making the final outcome very similar to the challenge's goal.
What challenges did you encounter, and how did you overcome them?The most difficult was placing the image inside the container. Overcame it by resizing the image, through the image's width.
What specific areas of your project would you like help with?Making the project responsive, to be suitable for desktop and mobile. Felt it's still quite complicated for me at this initial learning stage.
@monicaivanovPosted 4 months agoHi, congratulations on finishing your challenge. I understand your frustration placing the image inside of the container, I had the same problem. I used "text-align: center" instead of padding-left and right for your .title and .description classes.
For mobile response I used:
'/Mobile view/
@media (max-width: 375px) { .container {
/here you write how you want your class to appear different, for example by giving another value for width/
}'
Im sure there are better solutions than mine but I hope it will help. Enjoy coding Monica
Marked as helpful0