Skip to content
OverviewSolutions
12
Comments
4
Deivid Esteferson
@deivid-esf

All comments

  • Deivid Esteferson•230
    @deivid-esf

    Heyy, good job!!

    That line is there because you put a image inside a div, and at css you defined just the lenght (width) of image. You can solve this using: .img img{ height: 100%; }.

    Other way you can use to solve this is defined the size of a div and put the image as background, like this:

    <html>
<body>
<div class="banner"></div>
</body>
</html>

css:
.banner{
width: 100px;
height: 100px;
background-image: url('link-image');
}
    Marked as helpful
  • Deivid Esteferson•230
    @deivid-esf

    Hey Javier, good job on this challenge!

    I noticed that the elements of the second container are next to each other and there is a blank space left. If you use FlexBox, this problem can be solved.

    You can use the 'justify-content: space-between' property to distribute the items evenly, with the first item at the beginning and the last item at the end. Hope this can help you! Good luck on the other challenges.

    container { //second container with the informations
display: flex;
justify-content: space-between;
}
    Marked as helpful
  • Deivid Esteferson•230
    @deivid-esf

    Hey, Jair! Good job! I loved the animation when clicked on button. If you'll allow me to give you feedback, don't forget to review your project's color contrasts, to improve readability and visibility in your page. Good luck in others challengs :)

    Marked as helpful
  • Deivid Esteferson•230
    @deivid-esf

    Oi, Raul! Você pode adicionar uma "div" por trás do elemento que vai receber o "border-radius". Daí para adicionar a cor, é só colocar o "background-color" na "div". Dessa forma, quando o elemento receber as bordas, a cor que está no fundo da div vai "preencher" o espaço deixado pelo arredondamento.

    Qualquer coisa pode mandar dm que te ajudo melhor com um exemplo :)

    Marked as helpful