CSS Table Display Layout

by abehnaz

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/holder/2.0/holder.js"></script>
<div class="panel panel-info">
    <div class="panel-body mc-option">
        <div class="mc-element">
            <button class="btn btn-info">A</button>
        </div>
        <div class="mc-element">
            Hello World
        </div>
    </div>
</div>

CSS

mc-option{
    display: table;
    border: 1px solid #FF0000;
}

mc-element{
    display: table-cell;
     border: 1px solid #0000FF;
}