@Emoji123-s
@m-rooeintan
Submitted
What are you most proud of, and what would you do differently next time?
That's good practice for flex basics. We can design this project with grid to.
What challenges did you encounter, and how did you overcome them?
The main challenge was on 3 columns, which I did by grouping cards and flex box.
What specific areas of your project would you like help with?
using flex box and grid.
@Emoji123-s
Posted
Hi m-rooeintan, amazing work with the project. The website is perfectly accessible, and it looks good on a range of screen sizes. Very well done!😉
@iliasminas
Submitted
What are you most proud of, and what would you do differently next time?
dcedvqe
What challenges did you encounter, and how did you overcome them?
xc
What specific areas of your project would you like help with?
cadca
@Emoji123-s
Posted
Hi @iliasminas, congratulations on completing the project. Upon reviewing, your solution differs from the preview design, and here are some improvements I think could be made
Have fun! 😉
What are you most proud of, and what would you do differently next time?
I like that I got to make use of a grid layout and figured out how to make lines seperating thet content using background color.
What challenges did you encounter, and how did you overcome them?
I had a hard time making the card a certain size no matter how big the window was but figured it out at the end.
What specific areas of your project would you like help with?
I would like a good amount of styling tips to make this project easier and some css syntax tips to potentially have less lines of code next time.
@Emoji123-s
Posted
Hi @yoe7501, amazing work with the project. Upon previewing the webpage, it is accessible, but the font-color of the entire page elements is the same. Color references were provided in the style-guide.md in the project folder, so you can check that out to fix the colors to match the design template. The mobile view looks good, and responsive too, but it doesn't match the mobile design template, and the margins for the image seem to be a lot when moved to the mobile. Basically, the container is supposed to span the entire page for the mobile view, and the image should lose its margins and span the top, while responding to changes in screen sizes.
With these changes, your project will be much more like the design. Have fun! 😉
Marked as helpful
@ZakaryaMeddahi
Submitted
@Emoji123-s
Posted
Hi @ZakaryaMeddahi, the preview here looks amazing! Well done with the project. It doesn't seem to open on a new page. It says the github pages isn't found
@l-white
Submitted
@Emoji123-s
Posted
Hi @l-white, very well done with the project! It looks amazing. I noticed a "P" at the top right corner of your image, so I'm guessing you're a pro member, meaning you have access to figma files and such. Previewing the website, the entire container element spans to the right, and I know we are not dealing with responsiveness at the moment so I wouldn't talk about that. The positioning issue could be fixed with any one of these 3 ways
Absolute Positioning: position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
Flexbox: flex-direction: column; align-items: center; justify-content: center;
Margin: margin-left: auto; margin-right: auto;
With this, your container element should be aligned properly. Amazing work you've done here, and I can't wait to see you try more :)
@ad-monir2001
Submitted
What challenges did you encounter, and how did you overcome them?
To fix the hover item of eye image. Help of a brother.
@Emoji123-s
Posted
Hi @ad-monir2001. Well done with the project! Previewing the website, the container element was positioned to the right. The image width could be reduced to match the preview design, and the border radius of the container and the image could be increased. On a 320px device width, it doesn't respond as it should, alongside its expansion to other device specifications. The author's name and the image could be resized to match the preview design. Simple tweak here and there and this project will be top notch! :)
@christianGK1
Submitted
What are you most proud of, and what would you do differently next time?
Improving accessibility
What challenges did you encounter, and how did you overcome them?
It was an easy challenge, but I know I will face more complex challenges in the future.
What specific areas of your project would you like help with?
I didn't know how to hover the mouse over the title to change the shadow size, I solved it with the has pseudoclass:
@Emoji123-s
Posted
Hi @christianGK1, your project looks amazing and the layout looks good with the provided design. I think you used "800" as the font-weight for the "HTML and CSS Foundations" text and the author's name. But, once again, amazing work! :D
@nmmufti
Submitted
What are you most proud of, and what would you do differently next time?
This is my first webpage so I am quite happy that I am able to do it to look similar to the requirement.
What challenges did you encounter, and how did you overcome them?
I have watched many videos and follow along but never create a website from scratch at my own. So it was initially looking very difficult where to start. But once I started I was able to do it myself. I get some help from chatgpt
What specific areas of your project would you like help with?
I am new so I am not sure but I need a constructive feedback what to improve
@Emoji123-s
Posted
Hi @nmmufti, since you're new, welcome to the world of coding! Your baby steps today will produce great results over time. Beautiful work with the webpage, and yes, chatgpt is always there to help.... I use it too. Since you're looking for feedback, the overall page design looks exactly the same as the design template, but
Asides that, very well done!! I'd love to see what it is you do next!
Marked as helpful
