I have struggled with the images and I cant seem to fit them very well. Can anyone lend me a hand with that ?
Petros Devrikis
@PetrosdevriAll comments
- @EmrePWSubmitted over 1 year ago@PetrosdevriPosted over 1 year ago
Hey there, nice work and congrats for completing the project!
A few notes on your solution:
- Try changing the
width
of yourmain
element to a smaller value in order to ensure that both images and text display in harmony. By setting it toauto
you basically enable the browser to render it with issues (for example the image won't appear well if you zoom to 100%). I personally chose to wrap these elements inside a.product-preview
div
after themain
element and set awidth
of550px
and aheight
of400px
, which I of course changed for smaller devices by reducingwidth
and increasingheight
respectively.
In conclusion, your project seems to be decent and by working on various details and practicing frequently you will be able to achieve even better results.
Marked as helpful0 - Try changing the
- @IpieASubmitted over 1 year ago
It took a little longer than I originally planned, but it was worth it😁 I would be happy to hear what you think about my page
@PetrosdevriPosted over 1 year agoHey mate, nice work and congrats for completing the project!
There doesn't appear to be any issue since everything is set correctly (ratio doesn't play a huge role as proportions seem to be in line with the prototype).
In conclusion, your project seems to be decent, keep going!
0 - @Mohamed-Emad97Submitted over 1 year ago
If you see some suggestions to improve it, I will be grateful
@PetrosdevriPosted over 1 year agoHey there, nice work and congrats for completing the project!
A few notes on your solution:
- Try changing the
font-weight
of yourh1
to700
in order to make it bolder. This will also improve spacing between the elements. - By the way, congrats for using Vite, I haven't seen it being used often.
In conclusion, your project seems to be decent and by working on various details and practicing frequently you will be able to achieve even better results.
Marked as helpful0 - Try changing the
- @CodeBustlerSubmitted over 1 year ago@PetrosdevriPosted over 1 year ago
Hey there, nice work and congrats for completing the project!
A small note on your solution:
- You could probably increase the
width
property of.container
to 300px since you define most widths based on percentage, therefore they will automatically stretch to reach the same ratios as now (appearance will be the same).
In conclusion, your project seems to be decent and by working on various details and practicing frequently you will be able to achieve even better results.
Marked as helpful0 - You could probably increase the
- @Tiyana19Submitted over 1 year ago
Please Provide your feedback!!! And tell me where I can improve my coding Skills... I usually struggle with my image's width and height property, if you guys can give me some suggestion, that would be a big help. Thank you
@PetrosdevriPosted over 1 year agoHey there, nice work and congrats for completing the project!
A few notes on your solution:
- Try removing the
padding
property on the.card-text
class as it's expanding the text of the class to the bottom. Instead impelement a flexbox withdisplay: flex
. - Image doesn't seem to have problems in my computer, but you can follow the solution mentioned by Dennis.
- You may want to eliminate some classes before the actual class your style is affecting (f.e. instead of
.main-class .card-component
you can just write.card-component
). Otherwise you may want to use SASS as a preproccessor because nesting can be done at an easier pace and you could save a lot of lines.
In conclusion, your project seems to be decent and by working on various details and practicing frequently you will be able to achieve even better results.
Marked as helpful1 - Try removing the
- @IpieASubmitted over 1 year ago
I'm a little unsure if the min-width in my media query is the best fit for this project. Overall, it was exciting building my first project from frontend mentor. Looking forward to more of this.
Do let me know what you think
@PetrosdevriPosted over 1 year agoHey there, nice work and congrats for completing the project, I am also a newbie here :P .
A few notes on your solution:
- I don't think you need to add
min-width
since the current implementation seems to fit well within mobile screens, plus defined margins are sufficient. Overall, you could answer me and elaborate on this proposal. - You could probably work a bit on reducing the width of the
.result
and.summary
sections. While the current implementation is still adequate, it occupies more space than needed. You may switch themax-width
property defined incontainer
to a lower value. - Range is a bit far-fetched compared to the ratio but I have done the same so it's overall fine.
In conclusion, your project seems to be decent and by working on various details and practicing frequently you will be able to achieve even better results.
Marked as helpful0 - I don't think you need to add
- @brijeshkumar001Submitted over 1 year ago
Hi there I’m Brijeshkumar and this is my solution for this challenge. 🚀
Please suggest me way to create responsive heights of the elements
Any suggestions on how I can improve and reduce unnecessary code are welcome!
Thank you. 😊✌️
@PetrosdevriPosted over 1 year agoGreat work, I think you could maybe make the height a bit larger or increase padding to leave more space available for the image. You may also want to follow the accessibility advice as it's a great way to use ARIA labels or roles to help disabled people. But overall nothing special, keep going!
0