display: -webkit-box; LOGO

display: -webkit-box;

by Andrew Pougher

HTML

<div class="container">
<div class="row">
<div class="col-sm-6">
<div id="store">
<div class="store"><span>ST</span><div class="roundal">SELF</div><span>RE</span></div>
</div>
</div>
</div>

<script>
	/* http://bit.ly/ARP71 */
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-4809804-1', 'auto');
  ga('send', 'pageview');
  </script>

CSS

div.roundal {
    background: orangered;
    width: 40px;
    height: 40px;
    border-radius:50%;
    margin: auto;
    font-size: 13px;
    text-align: center;
    color:white;
     font: bold 12px/40px Helvetica, Verdana, Tahoma;
}
#store {width:135px}
.store span {
  font: bold 34px/40px Helvetica, Verdana, Tahoma;}
.store {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  justify-content: space-around;
  justify-content: space-between;
}

JavaScript

// this is commercial work unit test. dont use this as its a copyright logo design. the css is a demo of what can be done for sharp scalable branding