title: Aligning different parts of a text string to left and right side of div
body: <p>I have added a chat window to my current project which uses razor. The problem I am having is that when a new line occurs its shifting everything to the left... A screenshot of the problem is <img src="https://i.stack.imgur.com/4VtGT.png" alt="capture"> the red line shows where the highlighted text should be aligned-right.. The current code that displays this area looks like this:</p>
  
  <pre><code>&lt;div id="messages" class="rectangular-area" style="text-align: left; width: 600px;"&gt;
  &lt;h3&gt;
      Latest received events:
  &lt;/h3&gt;
   @For Each item In xList
     If item.Contains("System Message") Then
         @&lt;br /&gt;@&lt;b style="color: Red"&gt;@item.Split("-")(0)  - &lt;b style="color: Black"&gt;@item.Split("-")(1) : &lt;b style="color: #8B6508"&gt;@item.Split("-")(3)&lt;/b&gt;&lt;/b&gt; &lt;/b&gt;
     ElseIf item.Contains("*******@******online.com") Then
         @&lt;br /&gt;@&lt;b style="color:#00CDCD"&gt;@item.Split("-")(0) &lt;b style="color: Blue"&gt;(@item.Split("-")(1)) &lt;b style="color:Black"&gt; : @item.Split("-")(2)&lt;/b&gt;&lt;/b&gt;&lt;/b&gt;
     ElseIf item.Contains("************") Then
        @&lt;br /&gt;@&lt;b style="color:#00CDCD"&gt;@item.Split("-")(0) &lt;b style="color: #E066FF"&gt;(@item.Split("-")(1)) &lt;b style="color:Black"&gt; : @item.Split("-")(2)&lt;/b&gt;&lt;/b&gt;&lt;/b&gt;
     ElseIf item.Contains("************") Then
         @&lt;br /&gt;@&lt;b style="color:#00CDCD"&gt;@item.Split("-")(0) &lt;b style="color: #66CDAA"&gt;(@item.Split("-")(1)) &lt;b style="color:Black"&gt; : @item.Split("-")(2)&lt;/b&gt;&lt;/b&gt;&lt;/b&gt;
     Else
          @&lt;br /&gt;@&lt;b style="color:#00CDCD"&gt;@item.Split("-")(0) &lt;b style="color: #FFA54F"&gt;(@item.Split("-")(1)) &lt;b style="color:Black"&gt; : @item.Split("-")(2)&lt;/b&gt;&lt;/b&gt;&lt;/b&gt;
     End If
  Next
  &lt;/div&gt;
  </code></pre>
  
  <p>Any ideas on how to achieve this feat? I have tried using align-left in the third <code>&lt;b style&gt;</code> of every type and that does not work..</p>