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
Request path contains unescaped characters
Not Found

Submitted

3 column preview card component using HTML5, SASS, BOOTSTRAP 5

Sayantani Patraโ€ข 55

@iamsayantanipatra

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


1. I want to know that how to remove the blue outline in buttons while clicking on them, as I am using bootstrap5.

  1. How to improve in my projects?๐Ÿ“–

  2. Feed backs are most welcome!๐Ÿ˜Š

Community feedback

Ufukโ€ข 165

@UfukDulger

Posted

Hey looks good. You can add white border for buttons. You can add border-sizing:border-box in your body element it makes things easy for you.

Marked as helpful

1

Sayantani Patraโ€ข 55

@iamsayantanipatra

Posted

@UfukDulger thank you so much for the advice!

0
Eric Karuguโ€ข 210

@erickarugu

Posted

Hello Sayantani๐Ÿ‘‹,

Good job! Your solution looks splendid. Regarding the blue border, Bootstrap has a box-shadow CSS style for buttons in focus state:

.btn:focus{ box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 25%); } So overriding this by setting it to none, i.e box-shadow: none or tweaking it to your liking will get you there.

Happy Coding!

Marked as helpful

0

Sayantani Patraโ€ข 55

@iamsayantanipatra

Posted

@erickarugu32 thank you so much for your help. I will try to update my project again!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord