JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<body>

<div class="container">
   <img src="http://via.placeholder.com/200x50"> 
   <div class="bottom-right">Bottom Right aligned to outer container, why?</div>
</div>
<br/>
<div class="container">
  <div class="box">line<br/>line<br/>line<br/>line<br/>line</div>
  <div class="bottom-right">Bottom Right aligned to inner box</div>
</div>

CSS

.container {
    position: relative;
    border: black 1px solid;
}

.bottom-right {
    position: absolute;
    bottom: 0;
    right: 0;
    background: lightgreen;
}

img {
	  width: 100%; 
    border: red 1px solid;
    box-sizing: border-box;
}
.box {
    border: red 1px solid;
}