Centering responsive 100% width block with width contraint.

gistfile1.html

<style>
    .centering-fullwidth {
        width: 100%;
    }
    .constraint-container {
        width: 500px;
        margin: auto;
    }
</style>

<!-- full width centering container -->
<div class="centering-fullwidth">
    <!-- 500px width constraint -->
    <div class="constraint-container">
        <!-- start responsive content -->
        <div style="width: 100%; background: black; height: 400px;"></div>
        <!-- end responsive content -->
    </div>
</div>