There must be a simple solution for this. This is not true.
Some of them talk about vertical alignment: text-bottom or just vertical-align: bottom. Like this:
<p style="background:#eee;font-size:1.3em;color:#022662;height:116px;"> <img width="174" height="216" src="#" style="vertical-align:bottom;margin-right:10px;"> <strong>Text 1</strong>, <br> text 2, <br> text 3 </p>
This works the way you plan if you have only one line of text, as this is the first line of text aligned with the image. This is because, by default, <img / ">: inline; is displayed. If you have only one line, go for it.
If you need a more reliable solution, use positioning.
<p style="background:#eee;font-size:1.3em;color:#022662;height:116px;position:relative;"> <img width="174" height="216" src="#" style="margin-right:10px;"> <span style="position:absolute;bottom: 0;"> <strong>Text 1</strong>, <br> text 2, <br> text 3 </span> </p>
This works in IE7 standards mode and in IE8 standard. Also in Firefox, etc. Please note that the left position is not specified, by default it should be out of position: absolute;
Due to the fact that hasLayout is not true in Quirks mode in IE6, 7 and 8, the solution does not work. You must give it a "layout", giving it a measurement with height or width, or simply return to the old faithful zoom: 1;
<p style="background:#eee;font-size:1.3em;color:#022662;height:116px;position:relative;zoom:1"> <img width="174" height="216" src="#" style="margin-right:10px;"> <span style="position:absolute;bottom: 0;"> <strong>Text 1</strong>, <br> text 2, <br> text 3 </span> </p>
There you have it.