Struggling with aligning elements to the right within a container div in my Angular 2 project that utilizes Bootstrap 4 and Angular Material. Specifically, I aim to have both a button and text aligned to the right-hand side of the container.
Below is the code snippet I attempted to achieve the desired layout shown in the accompanying image:
<div class="container">
<div class="pull-right">
<p class="d-inline pull-right">Some text</p>
<button type="button" class="btn btn-primary pull-right">+</button>
</div>
</div>
https://i.sstatic.net/hg1bB.png
I also attempted the solution mentioned on StackOverflow:
<div class="container">
<div class="asdf">
<p class="d-inline pull-right">Some text</p>
<button type="button" class="btn btn-primary pull-right">+</button>
</div>
</div>
.asdf {
margin-left:auto;
margin-right:0;
}
However, neither of these solutions successfully moved the elements to the right. What could be the issue with my implementations?