Skip to content
OverviewSolutions
3
Comments
6
Holo Olagoke
@Olarra18

All comments

  • Holo Olagoke•50
    @Olarra18Posted over 1 year ago

    Yeah, I think it good to know the raw before going for framework as a beginner. Without knowing the raw css code it will be a bit difficult to amend framework code

    2
  • SIVA RAMA KRISHNAN S•140
    @siva-krish45Submitted over 1 year ago

    I have no idea how to get the box shadow not even closer to the design . can someone help me out ? and give me some valuable resources to master box shadow.

    Also give me your valuable accessibility, semantic html tips...

    Thanks in advance

    different four card layout using grid

    1
    Holo Olagoke•50
    @Olarra18Posted over 1 year ago

    @siva-krish45 I think it's because you did not add value to x and y offset of the box shadow that is the reason you did not get the result you expected.

    .wrapper .content .card{
width: 20.5rem;
height: 15.5rem;
display: flex;
flex-direction: column;
padding: 1.5rem;
border-radius: 5px;
box-shadow: 0 0 2px #000000;  /*the value of x and y offset is 0 which means no box shadow*/
}

    According to your CSS code you did not set value for the shadow box (x and y offset)

    You can read the MDN documentary on box-shadow: https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow. You can use this below code and adjust appropriately

    /* offset-x | offset-y | blur-radius | color */
box-shadow: 10px 5px 4px black;

    the 10px which is the offset-x mean right hand side shadow

    the 5px which is the offset-y mean bottom shadow

    the 4px which is the blur-radius mean how blur or glow you want the shadow to look like

    while the black mean the color of the shadow.

    I hope this could be of a help, Happy Coding

    Marked as helpful
    0
  • Holo Olagoke•50
    @Olarra18Posted over 1 year ago

    wow!

    0
  • S.R.T•10
    @CoolCoder24Submitted over 1 year ago

    Hello! While completing this challenge I struggled with finding a more efficient way as to coding the white background surrounding the QR code, and I was wondering if anyone could advise some tips as to how to make it more efficient and simpler?

    Any other feedback is also welcome!

    Thank you!

    QR Code Component built with HTML & CSS

    2
    Holo Olagoke•50
    @Olarra18Posted over 1 year ago

    Hi @CoolCoder24 I am also a beginner. Looking through your code at my own understanding I think you have code it at the best way but you did not create a responsive layout for mobile device view

    0
  • Holo Olagoke•50
    @Olarra18Posted over 1 year ago

    You can make centralize the item by using below CSS code

    body{
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
    0
  • Holo Olagoke•50
    @Olarra18Posted over 1 year ago

    that was amazing. How did you manage to justify the item and set it height

    0