With HTML and CSS, how to have an image that is vertically aligned with a horizontal line?

Posted by sungod000 on Stack Overflow See other posts from Stack Overflow or by sungod000
Published on 2012-07-10T21:06:26Z Indexed on 2012/07/10 21:15 UTC
Read the original article Hit count: 162

Filed under:
|
|
|
|

I'd like the image on the left to be adjacent to the horizontal line on the right (bottoms lining up flush). It should be responsive so that the line can change widths as needed. Right now, the image is sitting on top of the line, not beside it.

Here is the HTML

<div>
    <img src="image.png">
    <hr>
</div>

Here is the CSS

img {
    float:left
}
hr {
    width:100%
}

How to make this happen?

© Stack Overflow or respective owner

Related posts about html

Related posts about css