Center an Image

HTML

<div class="position-img-outer">
    <div class="position-img-inner">
        <img src="http://placehold.it/1000x300" class="position-img" alt="img" style=" height: 300px; " />
    </div>
</div>

CSS

.position-img-outer
{
    height: 300px;
    margin: 0 auto;
    overflow: hidden;
}
 .position-img-outer .position-img-inner
{
    display: inline-block;
    position: relative;
    right: -50%;
}
.position-img-outer .position-img-inner .position-img
{
    position: relative;
    left: -50%;
   
}