Skip to content
OverviewSolutions
3
Comments
6
Tom Trung Zacchia
@tomzacchia

All comments

  • Tom Trung Zacchia•125
    @tomzacchiaPosted about 4 years ago

    Hi Abdulazeez,

    Great work so far. Here are some things that I noticed:

    1. For the language elements, in some cases the text itself is larger than its parent. This is due to the fact that on line 123 of your CSS you have the following: .languages { width: 100px; padding: 5px auto; } The div with className .languages has a fixed width regardless of the text inside of it. I recommend that you removed the width property from this div.

    2. Pay more attention to the smaller details in the design, such as:

    • The job titles are black in the original design
    • There are also tags such as "new" and "featured" that are missing in your application

    Hope this helps, Tom

    0
  • Philani Ncube•150
    @PhilaniNcubeSubmitted about 4 years ago

    I wanted to add transitions on the slides but that was a bit challenging

    Room Homepage

    1
    Tom Trung Zacchia•125
    @tomzacchiaPosted about 4 years ago

    Hi Philani,

    One animation that you can add with relative ease is a "slider" like transition. You can use the "hidden: overflow" CSS property with some javascript to move one image out and "slide" in another on a user interaction, i.e click. I have done something similar in the past and I will link you to a codepen for reference.

    Hope this helps, Tom

    https://css-tricks.com/almanac/properties/o/overflow/ https://codepen.io/tomtomato/pen/BGRoPj (best viewed full screen)

    0
  • Pierre•215
    @pchatardSubmitted about 4 years ago

    Made this one with float for the top part and flexbox for the bottom part.

    Also used nth-of-type to shift ratings and quotes parts.

    I just saw the comparison on the page looks weird, I don't really know why because my view looks good when I open the link. I'm open to any suggestions of improvements !

    Float and flexbox solution

    2
    Tom Trung Zacchia•125
    @tomzacchiaPosted about 4 years ago

    Hi Pierre,

    Your solution looks good. The only difference I see is that the original design has a larger font size for the "10,000+" text and there is more empty space between the top of the page and the content.

    Tom

    0
  • Olatunji Oye•30
    @mystevotgitSubmitted about 4 years ago

    How can I track the exact ip of a device to find it's location

    IP-TRACKER

    1
    Tom Trung Zacchia•125
    @tomzacchiaPosted about 4 years ago

    Hi OLATUNJI,

    Its looking good. The only thing I noticed is that it only seems to accept IP addresses as input however the IPIFY API also accepts domain names as a query parameter for get requests. This capability will greatly enhance your application.

    Cheers, Tom

    0
  • Rafaela Gomes Ferreira•10
    @Rafahh97Submitted about 4 years ago

    I started learning frontend two months ago and now I have completed my first challenge. I had a hard time putting the cards in place (I needed some help). I am open to suggestions on how to improve not only this challenge, but my frontend skills in general.

    Four card feature section (HTML and CSS)

    3
    Tom Trung Zacchia•125
    @tomzacchiaPosted about 4 years ago

    Hey Gabriela,

    Something that seems very minor but adds up in bigger projects is the order you place CSS properties. I've attached a link that has some useful examples. Personally I struggle to always stick to conventions when styling as quick as possible but getting better at it one project at a time.

    Cheers, Tom

    https://css-tricks.com/poll-results-how-do-you-order-your-css-properties/

    0
  • Tom Trung Zacchia•125
    @tomzacchiaPosted about 4 years ago

    Hi Daniel,

    Pay special attention to the section that has the IP address information (IP Address, Location, etc..). I briefly checked it out and on mobile devices that part of the website takes up the entire view therefore obscuring the view of the map itself.Additionally one thing to note is that the input element is the width of the IP address information section on mobile screens.

    Hope that helps. Tom

    1