i need make white colour inside border along black description.
the actual scenario located here: http://buyersstop.blogspot.in/2016/01/motoe.html
my problem if applying white background colour black border showing around image.
div.img1 { border: 1px solid #777; } div.img1:hover { border: 1px solid #ccc; } div.img1 img { width: 100%; height: auto; } div.desc { padding: 15px; text-align: center; } * { box-sizing: border-box; } .responsive { padding: 6px 6px; float: left; width: 32.99999%; } @media screen , (max-width: 700px) { .responsive { width: 49.99999%; margin: 6px 0; } }
<div class="responsive"> <div class="img1"> <a target="_blank" href="img_fjords.jpg"> <img src="http://ecx.images-amazon.com/images/i/71ygvtpqnkl._sl1500_.jpg" alt="trolltunga norway" width="600" height="400"> </a> <div class="desc">add description of image here</div> </div> </div> <div class="responsive"> <div class="img1"> <a target="_blank" href="img_fjords.jpg"> <img src="http://ecx.images-amazon.com/images/i/71ygvtpqnkl._sl1500_.jpg" alt="trolltunga norway" width="600" height="400"> </a> <div class="desc">add description of image here</div> </div> </div> <div class="responsive"> <div class="img1"> <a target="_blank" href="img_fjords.jpg"> <img src="http://ecx.images-amazon.com/images/i/71ygvtpqnkl._sl1500_.jpg" alt="trolltunga norway" width="600" height="400"> </a> <div class="desc">add description of image here</div> </div> </div> <div class="responsive"> <div class="img1"> <a target="_blank" href="img_fjords.jpg"> <img src="http://ecx.images-amazon.com/images/i/71ygvtpqnkl._sl1500_.jpg" alt="trolltunga norway" width="600" height="400"> </a> <div class="desc">add description of image here</div> </div> </div>
.post-body img { padding: 8px; background: #fff none repeat scroll 0% 0%; border: 1px solid transparent; box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.2); border-radius: 0px; } div.desc { padding: 15px; text-align: center; background-color: #fff; color: #000; }
this should take care of it.
Comments
Post a Comment