vertically align link next to image with CSS

This question already has an answer here:

  • Vertically align text next to an image? 20 answers

  • 4.8. Vertical alignment: the 'vertical-align' shorthand baseline alignment property

    Applies to: inline-level and 'table-cell' elements

    This property affects the vertical positioning of the inline boxes generated by an inline-level element inside a line box. The following values only have meaning with respect to a parent inline-level element, or to a parent block-level element, if that element generates anonymous inline boxes; they have no effect if no such parent exists.

    While the elements a and img are both inline by default, the property vertical-align:middle should be used on the img element instead.

    jsFiddle example

    .myDiv img {
        vertical-align: middle;
    }
    

    try this:

    .myDiv img{
    vertical-align:middle;
    }
    

    DEMO


    Add vertical-align:middle; to the image instead of link.

    Updated fiddle here.

    链接地址: http://www.djcxy.com/p/41528.html

    上一篇: 如何在div中垂直居中文本?

    下一篇: 使用CSS将图像旁边的链接垂直对齐