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

  • P
    yele.m 330

    @YelemyahM

    Submitted

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

    I really struggle with image as background, taking 100% of the screen, while having a padding.

    P

    @Rohloffmeister

    Posted

    Hi, Your Website looks good so far. To start with your problem you could try putting the footer outside of your <main> (this also helps with accessibility. If you want to know more google "HTML Semantic Elements"). I also saw that the 4 images can get pretty big. I personally would use the grid property.

    /* Dekstop and Tablet*/
    .img-grid{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    }
    .img-grid img{
      width: 15wv;
    }
    
    /* Tablet  */
    
    .img-grid{
      display: grid;
      grid-template-columns: repeat(4, 1fr);
    }
    .img-grid img{
      width: 22wv;
    }
    
    /* Mobile */
      .img-grid {
        display: grid;
        grid-template: repeat(2, 1fr) / repeat(2, 1fr);
      }
    
    .img-grid img{
      width:40wv;
    }
    
    

    Thats how i did it. I hope this helped you a bit.

    Marked as helpful

    0
  • P

    @Rohloffmeister

    Posted

    Looks very good so far. I personaly would've added another media query(between 500px width and 1000 px width), because the boxes get really thin when you have a thin screen over 500px wide.

    0
  • @Citycod

    Submitted

    What are you most proud of, and what would you do differently next time?

    i would love to research more.

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

    i had issues doing the four card in different positions.

    P

    @Rohloffmeister

    Posted

    That looks very good. I dont really know what could be improved. I personly would limit the width of the cards so they dont stretch so much.

    Marked as helpful

    0
  • P

    @Rohloffmeister

    Posted

    Looks very good. I dont see any problems.

    Marked as helpful

    0
  • P

    @Rohloffmeister

    Posted

    Looks pretty good. Only thing i can say is that you should probably size everything up since the text is barely readable without zooming.

    0
  • P

    @Rohloffmeister

    Posted

    Looks good so far. You could play around with the "font-weight:" to get the font thinner for the "Front-end developer..." part and maybe add a border radius to the buttons.

    0
  • P

    @Rohloffmeister

    Posted

    Looks very good. I personaly would make the border 1px thick and I think you forgot to implement the hover state for the "HTML & CSS foundations". If you dont know what i mean look at the picture in the design folder (design/active-states.jpg). If you dont know how to do that yet maybe google for "CSS :hover".

    1
  • P

    @Rohloffmeister

    Posted

    Looks pretty good. Only thing i saw i that the text can get pretty small on big and wide screen (iPad Pro 1024x1366) And there are some empty lines in the myText class selector

    .mytext{
        flex: 1;
        
     
        padding: 8px;
    }
    
    0