Skip to content
OverviewSolutions
52
Comments
27

Fat

@FahatmahPhilippines910 points

Wanna learn more and more! LEARNING IS ENDLESS!

I’m currently learning...

JavaScript

Latest solutions

View more solutions

Latest comments

  • Fat•910
    @Fahatmah

    Hello @elaineleung, you inspire me a lot hehe 😁 but I want to ask how do you make like a tree repository in github and then add new repo where you can make them their own github page just like what you did in your main repo frondentmentor

  • Fat•910
    @Fahatmah

    I like the animation on the text ☺ like one of the best way to make users see that there is something changed after they clicked the button.

  • Fat•910
    @Fahatmah

    Hello @JannieLhynn 👋

    I think your solution is not being rendered because in your Github repo, the index.html can not be accessed because it is inside of a folder. Try to separate it from that folder and let me know if it works. Hope it helps 😁✌🏼

  • Fat•910
    @Fahatmah

    Hello Kegan! 👋

    To answer you first question, you can try flexbox when the screen is in the desktop size, you see in the designs the first three elements which are the img, h2, and p, you can set the alignment to flex-start or you can just set the a to flex-end

    This is what I mean:

    .card {
   display: flex;
   flex-direction: column;
}

.card a {
   align-self: flex-end;
}

    If the .card a won't work, just add justify-self: flex-end;

    Hope that works. 😁

  • Fat•910
    @Fahatmah

    Hello Nicholas Albuquerque! 😊

    I think you just need your .card-banner give a position: relative; and then you can try this:

    .card-banner::before {
   content: url(images/icon-view.svg);
    background-color: var(--Cyan);
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    inset: 0;
    opacity: 0;
    z-index: 20;
    width: 100%;
    height: 100%;
    transition: 0.5s;
    cursor: pointer;
}

    This was what I did to mine. Hope it helps you! 😊

  • Fat•910
    @Fahatmah

    Hello Lucas! Great work! The second and last also happened to me but I just let that way 😄 About the hero image, we almost have the same approach as I made an image wrapper then set a max-width on it then the image will be 100% of its width.

    For the use of tags, I think it would be better if you use div tag rather than another ul inside of li which has a parent of ul. When I did that ul, I ran into issues such as hovering links. This is all 😅

    Marked as helpful
View more comments