Выровнять изображение по низу двухстрочного текста в абсолютно позиционированном элементе div? - PullRequest
Новая
       15

Выровнять изображение по низу двухстрочного текста в абсолютно позиционированном элементе div?

0 голосов
/ 07 октября 2011

У меня есть абсолютно позиционированный div, содержащий изображение рядом с двумя строками текста и поле между ними.
Я хочу, чтобы нижняя часть изображения была выровнена либо по нижней части второй строки текста, либо по нижней части div.

Вот изображение, показывающее, как оно должно выглядеть: изображение выровнено по нижнему краю текста http://www2.isw.com.au/home/sjleis/stuff.nsf/align-image-bottom.gif

Вот XHTML, который я использовал, но это выровняет изображение по нижней части первой строки текста вместо второй: 

<div style="position: absolute; bottom:0; right:0">  
  <img src="images/footer-subscribe.png" title="Subscribe to ISW news" alt="Subscribe to ISW news" style="vertical-align: bottom; margin-right: 25px"></img>  
  &#169; Copyright 2011 ISW Australia<br/>Privacy Statement | Disclaimer  
</div>

Я полагаю, что с помощью background-image CSS можно было бы легче расположить изображение, но оно станет ссылкой.

1 Ответ

0 голосов
/ 07 октября 2011

Просто оберните текст в inline-block div: 

<div style="position: absolute; bottom:0; right:0">  
  <img src="images/footer-subscribe.png" title="Subscribe to ISW news" alt="Subscribe to ISW news" style="vertical-align: bottom; margin-right: 25px" />  
  <div style="display:inline-block;">© Copyright 2011 ISW Australia<br/>Privacy Statement | Disclaimer</div>
</div>
...