Bootstrap, align text to the right with strong tag within it
<p>This might be a silly question, but how can I align piece of my text inside Alert tag in Bootstrap to the right, while keeping a piece within this text in <code>&lt;strong&gt;</code> tag?</p>

<p>For now I have this piece of code:</p>

<pre><code>    &lt;div class="alert alert-warning" role="alert"&gt;
        Error number: &lt;strong&gt;{{ error.error_number }}&lt;/strong&gt;
        Active since: &lt;strong&gt; {{ error.datetime }}&lt;/strong&gt;&lt;/br&gt;
        Message: &lt;strong&gt;{{ error.error_message }}&lt;/strong&gt;
    &lt;/div&gt;
</code></pre>

<p>Which results in </p>

<p><a href="https://i.stack.imgur.com/N7Aop.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/N7Aop.jpg" alt="first screenshot"></a>
</p>

<p>So far so good, but the "active since and datetime" I want to be aligned to the right. So I tried using <code>p class="text-right</code> tag, but this will override <code>strong</code> tag, moreover it will put whatever is inside to new line. So this code:</p>

<pre><code>    &lt;div class="alert alert-warning" role="alert"&gt;
        Error number: &lt;strong&gt;{{ error.error_number }}&lt;/strong&gt;
        &lt;p class="text-right"&gt;Active since: &lt;strong&gt; {{ error.datetime }}&lt;/strong&gt;&lt;/p&gt;&lt;/br&gt;
        Message: &lt;strong&gt;{{ error.error_message }}&lt;/strong&gt;
    &lt;/div&gt;
</code></pre>

<p>will look like </p>

<p><a href="https://i.stack.imgur.com/FTapS.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/FTapS.jpg" alt="this"></a>
</p>

<p>Any ideas?</p>