HTML and CSS

Community feedback

• 

  Matthew Pierce•495

  @shake88juntPosted over 3 years ago

  Good job. An improvement would be to set the background color of the music icon to same color of the Annual plan background. (Ex. white to light blue).

  A way to create background images that properly scale would be to create a div with the img inside of it -> <div> <img src = "./example_img.png"/> </div> then set the img visibility to hidden with 100% width-> <styles> img{ visibility: hidden; width: 100%; } </styles>

  then set the background url -> <styles> div{ width: 100%; background: url('example_img.png') no-repeat; background-size: 100% 100%; } </styles>

  CODEPEN EXAMPLE => Codepen Link

  Marked as helpful

  1

  ---

  

  Vihaga Yohan•15

  @VihagaYohanPosted over 3 years ago

  @shake88junt Thank u for u feedback :)

  1

  

  Gaurav Shekhawat•35

  @Gaurav-ShekhawatPosted over 3 years ago

  @shake88junt Can you please tell me what are you trying to achieve with that codepen. I mean which problem were you facing??

  0

  

  Matthew Pierce•495

  @shake88juntPosted over 3 years ago

  @Gaurav-Shekhawat It just shows how to create scale-able background images. In that example the image container has a fixed width, but you could use that method to create background that maintain their dimensions.

  0

  

  Gaurav Shekhawat•35

  @Gaurav-ShekhawatPosted over 3 years ago

  @shake88junt oh, nice

  0
• 

  Gaurav Shekhawat•35

  @Gaurav-ShekhawatPosted over 3 years ago

  I don't know if it will work, but try to enclose your card div inside other div, let say whose class is "outer-container", then set the background of that "outer-container" as that svg file.

  Marked as helpful

  1

  ---

  

  Vihaga Yohan•15

  @VihagaYohanPosted over 3 years ago

  @Gaurav-Shekhawat Thank u for u feedback :)

  0