I had a lot of challenge with best practice. Any tips on how to make the code better will be highly appreciated
TOCHUKWU UCHE
@Toch007All comments
- @OluwalolopeSubmitted over 1 year ago@Toch007Posted over 1 year ago
I think I understand just what you mean. Check out my code and see if it can be of help to you. https://github.com/Toch007/fronend-project-8.
Thanks and keep coding bro
0 - @huey-ioSubmitted about 2 years ago
Need advice on making better card layouts, have done them in the past but more in-depth advice would be appreciated. I think I just need to get better with the height and width properties for assigning multiple div's when building cards, multiple layout cards are also a process I find rather difficult. All advice appreciated
@Toch007Posted about 2 years agoCongratulations on your successful completion of the project.
You actually did a great job, however, you still have some work to do. I went through your code and it needs a bit of work. I would advise you to go through the code of some of the completed works of this same project on the platform, you will definitely learn a thing or 2. Especially how to outline your HTML to make it work with your CSS. You can also check out my code, it may be of help to you. https://github.com/Toch007/frontendproject3.git Keep up the good work. Happy coding
Marked as helpful0 - @kutu-devSubmitted about 2 years ago
- Have I made a good use of the BEM methodology?
- Is bad to use div as a responsive image?
@Toch007Posted about 2 years agoHello and congratulation on successfully finishing this challenge. However, I just wanted to point out something about your HTML code. A "button" element cannot have a "div" element as a child element. E.g <button><div></div></button>, is not an accepted practice. If I may suggest, you may use <button><svg></svg>Add to cart<button>. I hope this helps. Happy coding
1 - @iamdrmekaSubmitted about 2 years ago@Toch007Posted about 2 years ago
Hello and congratulations on successfully completing the challenge.
The project looks good and nice. The only issue I may have is in your hover property. I believe you should set the cursor to pointer to enable the cursor to change to a pointer when it is hovering above some of the objects. Apart from that, I believe the rest of the code is ok. I wish you good luck in your coding experience. Enjoy
Marked as helpful1 - @PhilaleSubmitted about 2 years ago
I'll appreciate any feedback! I had a problem with the hover effect of the main image, because the height of the hover div was 5px bigger than the height of the image. I fixed it with absolute positioning and moved it up by 5px, but I still don't know the reason.
@Toch007Posted about 2 years agoHey there, You did such a great job. It looks so great. I love the way your code is outlined, it looks really nice. The only issue I have with your code is your "img" tag on your HTML. It's best practice for all your img tags to have the "alt" attribute even if it's empty, just make sure it's there. Then the other thing is that you gave your first img tag a width of "100%" which is wrong. The default measurement for the width and height of pictures on HTML is in PX (Pixels) and the px should not be indicated. For example, <img class=
border-rad
src=images/image-equilibrium.jpg
alt=equilibrium
width=100
>, the (width ="100") there means that the width of the picture is 100px, the px should not be indicated on HTML. Asides from this I believe you are good to go. Keep up the good work.Marked as helpful1 - @AoamosSubmitted about 2 years ago@Toch007Posted about 2 years ago
Great job bro. Your design looks great, however, your HTML needs a bit of work. Some elements need to be wrapped even inside the container, in my opinion. I believe with consistent practice you will get there. Please don't be afraid to check the code of other solutions and learn a thing or two from them. Keep up the good work
Marked as helpful0 - @Ems2201Submitted about 2 years ago@Toch007Posted about 2 years ago
This is one of the best I have seen so far. I love the transition to the mobile view, really smooth. The only issue is that since you are using an Article Element, you might have to include h2 - h6 elements, or you could just change it and use the Div element. I believe the Article Element is mainly for writing articles. I hope this helps. Keep up the good work.
0 - @HrHasnaiSubmitted about 2 years ago@Toch007Posted about 2 years ago
Great job buddy. The transition on your project was so smooth that I had to check out your code. However, I noticed that your code is a Responsive Web Design because you have a different folder for mobile CSS and the Main CSS and you avoided using the Media query. The height of your object on the main view and the width of your object on the mobile view is excess in my opinion. I think you need to work on that also. Apart from the little issues I raised, I believe your job is good to go.
0 - @Mourad3rdSubmitted about 2 years ago
I struggled with 2 things
- I couldn't use the Ethereum icon from Font awesome in the pseudo element as I did with the clock icon, it didn't show.
- I think I didn't get the shadow of the container right, did my best to get as close as possible.
@Toch007Posted about 2 years agoAwesome job you did there. I really love it. however, your job isn't done just yet. Take a look at the sample designs sent with the project. you haven't touched the hover part yet. You are doing really great. keep it up
Marked as helpful0 - @DhruvX1Submitted about 2 years ago@Toch007Posted about 2 years ago
This is a great job for a beginner. This project also gave me a hard time, I must admit. The next step you will have to take is to go through the codes of other who you think did well at the project and try out their codes, see the effects of the code and use those that make sense to you. Use at least 5 people for your research. You will see it works like magic.
0 - @Ammar0YasserSubmitted about 2 years ago
Thanks a lot for your first feedback😁
This is my 2nd submission after fixing some issues that has been reported and some points that your awesome feedback mentioned
Is there any improvements that can make this code better ?
@Toch007Posted about 2 years agoGreat job you did there but there are a few things you may need to work on. Especially the overflow. Its too much. Since your display is flex you can use the 'flex-basis' function. Also set flex to rows on main view and column on media query. Other than that you are good to go. I wish you all the best.
Marked as helpful1 - @ClaireLise-devSubmitted about 2 years ago
Here is my solution for Product Preview Page! I thought it was a simple one but the image was not that easy to deal with because of the mobile or desktop version.
@Toch007Posted about 2 years agoGreat Job you did there. Not bad at all. As for the display I would advise you look at your html and CSS properly, especially the media query the min-width is supposed to be set at 374 but you set it at 960 or so. Try going through some good solutions on the platform and you may see the reason why your display is one sided. Thanks and have a nice time.
0