Bera
Bera

Reputation: 85

How to add shadow to a image

I am trying to add shadow to image in my project, NOT in the complete div. I add box-shadow property in CSS but its not working. Someone please help me! thank you.

<!DOCTYPE html>
    <body>
    <div class="container-fluid">
     <div class="row">
       <div class="col-sm-2>
         <a href="#"><img class="image-responsive" src="images/help.jpg></a>
         <a href="#>XXXXXXXX</a>
         <a href="#>XXXXXXXX</a>
         <a href="#>XXXXXXXX</a>
         <a href="#>XXXXXXXX</a>
       </div>
     <div class="col-sm-10>
    </div>
    </body>
    </html>

Upvotes: 0

Views: 101

Answers (1)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167240

Use box-shadow:

img {
  box-shadow: rgba(0, 0, 0, .6) 5px 5px 5px;
}
<div class="container-fluid">
  <div class="row">
    <div class="col-sm-2">
      <a href="#">
        <img class="image-responsive" src="images/help.jpg">
      </a>
      <a href="#">XXXXXXXX</a>
      <a href="#">XXXXXXXX</a>
      <a href="#">XXXXXXXX</a>
      <a href="#">XXXXXXXX</a>
    </div>
    <div class="col-sm-10">
    </div>
  </div>
</div>

And make sure you close all the <div> tags correctly.

Upvotes: 1

Related Questions