Skip to content
OverviewSolutions
15
Comments
5
khannfouad
@khannfouad

All comments

  • Lala A.•30
    @lalaholmesssSubmitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    This is my first coding project that I've coded myself without following a tutorial and with some help from my friend. It took me 2 - 3 days to complete due to my procrastination, and I'm really happy that it turned out good in the end, though it could've taken me a lot faster. Good luck to all the beginners ^-^ We got this !!

    What challenges did you encounter, and how did you overcome them?

    Main challenge was positioning elements, used Google to overcome it and some help from my friend. Borders of the table. My friend helped me on that.

    What specific areas of your project would you like help with?

    Positioning elements. Also, the exact sizes / measurements weren't given (at least I couldn't find), so I did it as similar as possible to the image. If there are exact measurements I would like someone to tell me where I can find.

    Recipe Page using HTML and CSS

    1
    khannfouad•230
    @khannfouadPosted 5 months ago

    Great Work !! Specially since it's your first design it'll always be a special one. Secondly, => There are Free+ challenges that have Figma files attached to the starter files those are of great help. => If you are not a premium account holder you'll most likely have to eyeball the whole designs. It's a hit or miss. :D

    => Positioning elements in CSS involves a combination of properties such as margin, padding, position, and others like top, bottom, left, and right. The exact combination you use depends on the layout you want to achieve and your design preferences. Practice and experiment is what many of us are doing to achieve desirable results.

    So, All the Best. Happy Coding :D

    Marked as helpful
    0
  • srinu-vinay-kumar•20
    @srinu-vinay-kumarSubmitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    I am most proud of how I managed to create a responsive design that looks good on both mobile and desktop screens. Ensuring that the layout adjusted seamlessly to different screen sizes was a significant achievement for me. Next time, I would focus more on optimizing my code for better performance, including reducing the load time and improving accessibility features. Additionally, I would incorporate more user feedback early in the development process to refine the design and functionality.

    What challenges did you encounter, and how did you overcome them?

    One of the main challenges I encountered was dealing with cross-browser compatibility issues. Some features that worked perfectly in one browser did not behave the same in another. To overcome this, I used tools like BrowserStack to test my site across different browsers and devices. I also researched and implemented various polyfills and CSS hacks to ensure consistent behavior. Additionally, I had to deepen my understanding of CSS Flexbox and Grid to solve layout issues, which I managed through online tutorials and practice.

    What specific areas of your project would you like help with?

    I would like help with improving the efficiency and cleanliness of my CSS code. While my design is functional, I feel there may be more effective ways to structure my styles to reduce redundancy and improve maintainability. Additionally, I'm seeking advice on enhancing the accessibility of my project. Ensuring that my HTML and CSS are optimized for screen readers and other assistive technologies is important to me, and I would appreciate guidance on best practices. Lastly, feedback on how to better organize my HTML structure for readability and future scalability would be very beneficial.

    Social Links Profile using HTML, CSS

    3
    khannfouad•230
    @khannfouadPosted 5 months ago

    Semantic tags make HTML much more readable whereas Using CSS's in-built properties like inheritance and cascade plus grouping selectors ensures that your CSS is readable and clean. Happy Coding 🌺

    0
  • khannfouad•230
    @khannfouadPosted 5 months ago

    Great work

    0
  • ritu jha•60
    @ritujha19Submitted 5 months ago
    What specific areas of your project would you like help with?

    I have a question --> why does my file looks different in edge and different in google chrome .

    in edge my files looks prefect but in chrome my files looks different its like look everything goes up .

    why does it happens ?

    i don't know it happens on only laptop or anyone else also so please, preview my solution if you see this so. Please give me feedback .

    OR

    if u know why its happened , then please let me know about this also and also u know how to resolved it , so please help me also to resolved it .

    blog - preview -card ->solved

    2
    khannfouad•230
    @khannfouadPosted 5 months ago

    The issue is most likely coming from the 70vh you've set on the container. Different browser's view ports react in different ways when vh is concerned. Also it's a funky property that's why I like to avoid it.

    Solution will be to add a max-width property. Use 100vh on the body to center the container div. and remove height altogether from the container. Let your margin and padding handle the vertical length.

    Marked as helpful
    0
  • khannfouad•230
    @khannfouadPosted 5 months ago
    This comment was deleted 5 months ago
    0