Skip to content
OverviewSolutions
21
Comments
20
Ayjamal
@ay-jamal

All comments

  • Alexandre Oliveira•10
    @Ale557333Submitted 10 months ago

    I am having difficulty understanding how to use responsive media queries and where to seek help.

    Flexbox

    2
    Ayjamal•630
    @ay-jamalPosted 10 months ago

    display: flex; justify-content: center; align-items: center; background: #D5E1EF; height: 100vh;

    will do the job for you

    Marked as helpful
    0
  • Ayjamal•630
    @ay-jamalPosted about 2 years ago

    good

    Marked as helpful
    0
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    nice work , to center your div give the body display of flex with with justifay-content:center;

    , align-item:center; and flex-direction: column; , to remove the scroll make the margin of the body 0

    0
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    greet job man , to solve the image not showing in the github live server just remove the slash(/) before the images directory your html img would look like this <img src="images/image-qr-code.png" alt="qr code">

    Marked as helpful
    1
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    every thing is nice bro good job , one thing is about the background color try to change it with the right one from the style guide

    Marked as helpful
    0
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    great job for trying , there is some problems i saw when i open the live code try applying these things first in the body height: 100vh; // to center the container div display: flex; justify-content: center; align-items: center; padding: 0; margin: 0; // to remove the scroling

    and in the container class add width: 300PX; background: whitesmoke; padding: 1rem; border-radius: 10px;

    and look at the design guide for more info about the font famliy and colors and weight

    Marked as helpful
    0
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    your github page is not working try to fix that

    0
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    nice work bro it is nearly the same , one thing is about the box-shadow property try to increace the h-offset and the v-offset box-shadow: 2rem 2rem 2rem 1rem var(--grayish-blue);

    Marked as helpful
    0
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    nice work try to add some box-shadow to the cards like box-shadow: rgb(17 12 46 / 15%) 0px 48px 100px 0px;

    0
  • Sg•1,040
    @sukanyaguravSubmitted over 2 years ago

    unsure about Responsiveness

    HTML,CSS

    2
    Ayjamal•630
    @ay-jamalPosted over 2 years ago

    nice worke will done , there are some fixing you need to include in your design make the body height 100vh and give it a display of flex and justify-content: center; align-items: center; it will center you div , in the container div remove the height

    Marked as helpful
    0
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    nice work good job , i have some notes that will help you to center you card in the body tag remove the margin to property ,

    2, make the body display:flex; body { background-color: hsl(212, 45%, 89%); font-family: 'Outfit', sans-serif; text-align: center; display: flex; justify-content: center; align-items: center;

    Marked as helpful
    1
  • Ayjamal•630
    @ay-jamalPosted over 2 years ago

    nice work well done , i have some notes for your design first think is about the background color change the background color to background-color: hsl(212, 45%, 89%); on the container class

    or you can remove it from the container class and add the color to the body directly i got thes color value from the style guide file you need to check it

    0