Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • Breno• 40

    @Arouca-b

    Submitted

    Minha maior dificuldade é deixar o site responsivo, como posso melhorar meu aprendizado?

    media query

    2

    Josh Michael• 1,050

    @joshmichael23

    Posted

    Removing the height: 80% and adding maybe a little bit of padding for the top and bottom will make it more neat across all devices. Right now there's some extra space when the height of the device is a bit too high. Overall good job!

    0
  • Josh Michael• 1,050

    @joshmichael23

    Posted

    Good job on your project!

    I don't recommend using the <br> tag as it does not have any semantic meaning. You can use <span> inside your <p> tag and use display: block in it.

    Overall great design. Keep up the good work :)

    2
  • Josh Michael• 1,050

    @joshmichael23

    Posted

    Great job on your project. You can make it better by using the font given in the style-guide.md.

    What I usually do is go to fonts.google.com then search for the font. Add the necessary font-weights by clicking on the + and then click the cart on the top right. You can then use the <link> or the @import under the Use on the web section depending on your preference. Hope it helps :)

    Marked as helpful

    1
  • xirb22• 90

    @xirb22

    Submitted

    The style guide for this challenge mentioned a mobile and desktop width (mobile: 375px, desktop: 1440px) but I didn't really know what to do with this information. The mobile and desktop design looked the same so I ended up simply designing the card based on the mobile width. What would be a better way to use this information to create a responsive design?

    I also struggled to center the card in the middle of the screen. After some googling I ended up using

    body {
      margin: 0;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
}

    but this seems like a band-aid solution. Is there a better way to vertically align elements on the page?

    My first attempt at front-end web development - A very basic solution

    4

    Josh Michael• 1,050

    @joshmichael23

    Posted

    You can use the widths as reference when inspecting the element and changing the width according to the design. That way you can see if your project matches the it. :)

    0
  • Josh Michael• 1,050

    @joshmichael23

    Posted

    I love the spinning dice effect while fetching. Never thought of that 😁

    Marked as helpful

    1
  • Josh Michael• 1,050

    @joshmichael23

    Posted

    I noticed that there is a max-width: 1440px on your <div class="bod">. A white space is seen when the browser is more than 1440px. You can solve this by removing the max-width as it overrides the width: 100%.

    Also try to include a validation function on your upcoming projects as it was missing from this one.

    Overall, good job on the project :)

    Marked as helpful

    0
  • Josh Michael• 1,050

    @joshmichael23

    Posted

    Adding the cursor:pointer to the <h3> and <h4> tags would make it seem like the user would be clicking on a link.

    Overall, great job on your work!

    Marked as helpful

    0
  • P
    Chris• 770

    @ccccchriz

    Submitted

    Did i do the accessibility part of this challenge correctly? Thanks, for any feedback in advance.

    Faq accordion

    2

    Josh Michael• 1,050

    @joshmichael23

    Posted

    Hi Chris!

    Good job on the project. 👏

    I actually had that problem as well a few days ago. One mentor taught me that there should always be an <h1> to serve as the main header. It should always be followed by an <h2>, <h3>, and so forth.

    You can always style the <h1> tag's size according to your needs.

    Good luck on your upcoming projects. 😊

    2