Skip to content
OverviewSolutions
26
Comments
16

Marley Semende

@Marley-SemendeAmsterdam, Netherlands570 points

Hello there👋🏾. I'm Marley, I'm currently diving into Front-end development whilst also dabbling with back-end at night.

I’m currently learning...

JavaScript, React.js, Node.js, MySQL. I'm currently enrolled in a 7 month FullStack coding bootcamp at HYF Netherlands, with modules on HTML, CSS, JavaScript, Node.js, MySQL & React.js.

Latest solutions

View more solutions

Latest comments

  • Marley Semende•570
    @Marley-Semende

    Thank you!

  • Marley Semende•570
    @Marley-Semende

    Hello @Omar-Miled. Your site looks good on big screens, for smaller screens styling you can use the CSS Media queries. Below are some free resources where you can learn about media queries and how you can start using them in your projects: https://css-tricks.com/a-complete-guide-to-css-media-queries/ https://www.w3schools.com/css/css3_mediaqueries.asp And I highly recommend this free course below:

    https://courses.kevinpowell.co/conquering-responsive-layouts I hope this will be helpful. Happy coding:)

    Marked as helpful
  • Marley Semende•570
    @Marley-Semende

    Hi @dpiskov. Nice work! Here is my recommendations for learning responsivity. Checkout this free course by Kevin Powell. It really helped me when I was struggling with responsive layouts. I highly recommend checking it out if you havent already. https://courses.kevinpowell.co/conquering-responsive-layouts And also I use an app called Responsively, it's a great tool for checking if your sites are responsive. Happy coding:)

    Marked as helpful
  • Marley Semende•570
    @Marley-Semende

    Hi @Lawrencekalaw. nice solution! I found a few issues with your css. In your .container{} you used properties like justify-content and align-items but I noticed that your .container{} is not defined as a flex container. To define a flex container you need to set the display: flex; first. However according to the structure of your HTML file, .home{} is the one to be defined as the flex container not . container{}. Another thing I noticed is that in your media query your .home{} margin is set to 30px 500px 0. This margin may cause .home{} to extend beyond the viewport width on smaller screens. You should adjust the margins to fit the smaller screen sizes.

    Marked as helpful
  • Marley Semende•570
    @Marley-Semende

    Hi @Lerato123. This free tutorial by Kevin Powell, really helped me master responsiveness. I recommend checking it out if you havent already. https://courses.kevinpowell.co/conquering-responsive-layouts

    Marked as helpful
  • Marley Semende•570
    @Marley-Semende

    Hi @EdwinMugo, nice work! In-order to position the button correctly you can make use of the CSS Position property. For example:

    section {
position: relative
} 
button {
position: absolute
/*then you can make use of the top, right, left, bottom properties accordingly in the way you want to position your button */
}

    You can check out this resource to learn more about the CSS Position property: https://developer.mozilla.org/en-US/docs/Web/CSS/position I hope this helps. Happy coding :)

View more comments