Skip to content
OverviewSolutions
10
Comments
7
Hoaxilog
@Hoaxilog

All comments

  • Hoaxilog•170
    @HoaxilogPosted 3 days ago

    every grid item of yours after 760width is so stretch that there's a huge gap for every text form left to right. So for my opinion having huge gap on that is something I'm gonna change but overall it was so good especially how fluid it was when trying to check the responsiveness.

    0
  • Mehrine•120
    @DarkMoonLitSubmitted 2 months ago
    What are you most proud of, and what would you do differently next time?

    I was able to use javascript for the first time on a project. Even if it is basic, i give me hope that i can continue to grow.

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

    I had difficulties with the social media tag, how to place them and make them hover.

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

    I was able to use the button share for the social media to appear and disappear. But for the mobile layout, I cannot seem to make the button appear through the image so that i can click it back. As for the desktop layout, I don't know how to make the border similar.

    Article Preview Component with HTML, CSS and JS

    1
    Hoaxilog•170
    @HoaxilogPosted 2 months ago

    You can achieve it if you use the position relative for the parent and absolute for the children specifically your author-social-media. But first you need to get inside the share btn and your author-social-media in one parent only so if you put position absolute in your author-social-media it will be around the parent and not in the whole body (hope gets this part). and after that you can align it now you can use negative sign let say -10px or -5px like this.

    But in the arrow thing above the box you can learn about pseudo element such as :after and :before to achieve it.

    If you didnt get this try to watch about position absolute and relative since they can perform complex design and also about pseudo element. good luck <3

    0
  • Dimitrios Dristellas•590
    @dimitrisdrSubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    After completing this challenge I think that I have better understand some concepts about the CSS grid layout. I used both grid template areas and grid template columns logic.

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

    The html structure of each testimonial card is something that I got struggled with. Firstly I separated each card into two DIV 's but the result wasn't the desired one. After some YouTube video's I erased the second DIV and the result was a lot better.

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

    I would like to dive a lot into CSS-grid and Flex-box as well. Also, I think that I need to study semantic HTML as well.

    Testimonials-grid-section

    1
    Hoaxilog•170
    @HoaxilogPosted 3 months ago

    I like how you made your middle layout well done!

    0
  • Hoaxilog•170
    @HoaxilogPosted 3 months ago

    Hi we do the same solution for the image part wherein we set it to display: none and trying to display: block using media queries to show the image. but someone gave a feedback that it was better to use a <picture> tag for that scenarios.

    You can follow this link and see the explanation on why is it better:

    • https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture
    • https://www.frontendmentor.io/solutions/product-card-solution-3OjGsmsV3z

    thanks for letting me know by https://www.frontendmentor.io/profile/danielmrz-dev

    Marked as helpful
    1
  • Samiullah•410
    @samir-DeveSubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    With all due respect this field is somehow unnecessary

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

    It was easy and constructive !!

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

    Help not needed !!!

    Solid CSS and HTML

    1
    Hoaxilog•170
    @HoaxilogPosted 3 months ago

    Well done!

    0
  • Hoaxilog•170
    @HoaxilogPosted 3 months ago

    Well done! but if u want to perfectly center the text of your button you can use display flex and try to center it instead of using the padding trying to pixel perfect and center it is kind hard and us not good for responsive hope this helps

    Marked as helpful
    0
  • Hoaxilog•170
    @HoaxilogPosted 3 months ago

    instead of specifying what is the width of h2 you can try to use display: inline-block so it's not taking all available spaces and you can see the much better result when adding a background-color to your h2 and you will not be having a problem like you have right now in your h2 background hope this help and understandable

    0