wanna learn how to make page more efficient and how to make it looks more similar to Figma design
how to improve code to improve closeness to screenshot
Styling the table
What challenges did you encounter, and how did you overcome them?Create larger code blocks by wrapping code in 3 backticks
What specific areas of your project would you like help with?Write inline code snippets by surrounding code with single backticks
page is align to left and seems to take over page, try making body display grid and place items center
I’m really proud of how I was able to create a functional and visually appealing design for the project. It’s satisfying to see everything come together, especially with the adjustments I made to ensure the layout works across different screen sizes.
Next time, I’d focus on optimizing the performance even more, like reducing image sizes or using more efficient CSS techniques, such as Flexbox or Grid. I’d also make sure the layout works seamlessly across all browsers.
What challenges did you encounter, and how did you overcome them?I encountered a few challenges during the project, particularly with aligning elements and ensuring the layout was responsive. At first, some of the sections weren’t behaving as expected when adjusting the width or height for different screen sizes. It took some trial and error with the flex and margin properties to get everything aligned properly.
Another challenge was making sure the background applied to each link without causing the entire section to blend together. I had to carefully adjust padding and margin for each link while also using background-color to maintain clear visual separation.
To overcome these challenges, I took time to test different approaches in the CSS and used the browser’s developer tools to inspect how each element behaved on different screen sizes. I also referred to documentation and examples for better techniques to handle layout issues. It was a good learning experience to refine my skills in layout management and responsiveness.
What specific areas of your project would you like help with?I’d like help with ensuring the layout remains consistent across different devices, especially making sure elements are properly aligned when the screen size changes. I’m also looking for advice on improving the accessibility of my design, specifically in terms of making sure all interactive elements are easy to use for people with disabilities.
Additionally, I’d love to learn more about optimizing my CSS for better performance and scalability, particularly when working with larger projects in the future. I’m also interested in feedback on how to improve my use of flexbox or grid for layout management.
compared to design, yours is a little bigger in terms of size, but overall looks good and pretty close
setting of box shadow, i did overcome it by using box shadow of box-shadow: 10px 8px black;.
pretty close, some minor differences to the design
