title: Align items left in HTML
body: <p>I have a question about aligning items in HTML and CSS. I have a price and those prices must be aligned left, but as you can see these items are aligned left but the 4 must be 0 of the 80. These are prices and I think this is not very nice.</p>
  
  <p>One thing I forgot to mention is that these prices are not manually added prices. These are generated with an API. So in the solution you gave me, you can split the number and the decimal. In this case it is one number. Maybe there is a way to split the number and to solve it this way, but I hope there is a better solution. Also I give you a better view of the table. The only thing that must aligned better is the right table row not the left one. As you can see in the picture.</p>
  
  <p>EDIT:
  Code: This is the HTML code and I am also using AngularJS</p>
  
  <pre><code> &lt;td md-cell class="tableWidthSell tableBorderLeft tableInnerCell"&gt;
                      &lt;table md-table class="innerTable"&gt;
                          &lt;tbody&gt;
                              &lt;tr md-row class="datatableRow" ng-repeat="order in term.timeblocks.INTRADAY.SELL | orderBy: 'price': true"&gt;
                                  &lt;td flex="100" class="tablePaddingLeft clickable" ng-click="openOrder($event, order)" ng-class="{tableMyOrder: order.mine}"&gt;{{order.price|number:2}}&lt;/td&gt;
                              &lt;/tr&gt;
                          &lt;/tbody&gt;
                      &lt;/table&gt;
                  &lt;/td&gt;
                  &lt;!--Price data | Sell --&gt;
                  &lt;td md-cell class="tableWidthSell tableInnerCell"&gt;
                      &lt;table md-table class="innerTable"&gt;
                          &lt;tbody&gt;
                              &lt;tr md-row class="datatableRow" ng-repeat="order in term.timeblocks.INTRADAY.SELL | orderBy : 'price' : true "&gt;
                                  &lt;td flex="100" class="tablePaddingLeft clickable" ng-click="openOrder($event, order)" ng-class="{tableMyOrder: order.mine}"&gt;&amp;nbsp;{{order.quantity|number:1}}&lt;/td&gt;
                              &lt;/tr&gt;
                          &lt;/tbody&gt;
                      &lt;/table&gt;
                  &lt;/td&gt;
  </code></pre>
  
  <p>I hope someone can still help me.</p>
  
  <p><a href="https://i.stack.imgur.com/54mxH.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/54mxH.png" alt="Full image"></a></p>