放在<a>父元素的底部</a> <p>

Question

I believe this is a simple fix but so far I can't find it.

(Consider the screenshots below)

I have a <a class="addcomment"> within a <p> and I simply want the <a> to always be on the bottom left of the <p> , no matter its height.

Using position: relative; left: 0px; bottom: 0px; position: relative; left: 0px; bottom: 0px; doesn't do the job even though I am sure that the <p> is the parent of the <a> .

This is the current CSS styling for the element:

a.addcomment:link,
a.addcomment:visited {
  text-decoration: none;
  border-bottom: 1px dotted #820106;
  color: #820106;
}

a.addcomment:hover,
a.addcomment:active {
  text-decoration: none;
  border-bottom: none;
  color: #820106;
}

this looks good because the a tag is at the bottom anyways

this does not because the a tag is not at the bottom where I want it

Thank you for knowledge and suggestions in advance

Answer 1

Give the position:relative to the p, and the a with position absolute; bottom:0; left:0 position absolute; bottom:0; left:0

Answer 2

您可以为“ P”元素尝试最小高度。