I'm struggling to align the image flush with the right border of the div without any margin or padding. I've tried various methods but none seem to work. Hoping someone can provide a solution for me. Thank you. Below is the code snippet:
HTML
<div class="col-1-3">
<img src="http://city.kermanemajazi.ir/i/attachments/1/1413914460279666_large.jpg" alt="Image" id="image">
<h2> Heading </h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Id quisquam fugit maxime repellat corporis ipsa, a placeat! Nihil commodi asperiores reiciendis provident laboriosam, sit error!
</p>
<a href="#"> Learn More </a>
</div>
CSS
body
{
width: 100%;
margin: 0;
padding: 0;
}
.col-1-3
{
width: 320px;
border: 1px solid red;
text-align: center;
padding: 0;
}
.clip
{
padding-right: 0;
margin-right: 0;
}
Here is the jsbin link for the example code JsBin Example Code Thank you