Which corner will the puppy be in when these CSS rules are applied?

.pen {
  height: 100px;
  width: 100px;
  border: 2px dashed brown;
  position: relative;
}

#puppy {
  position: absolute;
  right: 80px;
  bottom: 0px;
}

<div class="pen">
  <span id="puppy">🐶</span>
</div>

1.  top-right corner
2.  bottom-right corner
3.  top-left corner
4.  bottom-left corner

Correct Answer:

•  bottom-left corner