For a better design:
<div class="es-card__meta">
<ol class="g-list-inline g-list-inline--delimited">
<li class="pull-right">
<a class="btn btn-es-default-o btn-sm" href="javascript:void(0);" data-es-groups-leave="" data-id="2">
Leave this Group</a>
</li>
</ol>
</div>
Better this way:
<div class="es-card__meta">
<ol class="g-list-inline g-list-inline--delimited">
</ol>
</div>
<li class="pull-right">
<a class="btn btn-es-default-o btn-sm" href="javascript:void(0);" data-es-groups-leave="" data-id="2">
Leave this Group</a>
</li>
The code is not complete. Sorry, it's just in a hurry
But for a better look it would be better to put the btn-es-default-o parallel to "g-list-inline g-list-inline--delimited". This is the list view and the button is not well placeable. Therefore, something emerges as in the photo.
<div class="es-card__meta">
<ol class="g-list-inline g-list-inline--delimited">
<li class="pull-right">
<a class="btn btn-es-default-o btn-sm" href="javascript:void(0);" data-es-groups-leave="" data-id="2">
Leave this Group</a>
</li>
</ol>
</div>
Better this way:
<div class="es-card__meta">
<ol class="g-list-inline g-list-inline--delimited">
</ol>
</div>
<li class="pull-right">
<a class="btn btn-es-default-o btn-sm" href="javascript:void(0);" data-es-groups-leave="" data-id="2">
Leave this Group</a>
</li>
The code is not complete. Sorry, it's just in a hurry
But for a better look it would be better to put the btn-es-default-o parallel to "g-list-inline g-list-inline--delimited". This is the list view and the button is not well placeable. Therefore, something emerges as in the photo.