Technology Addict
Technology Addict

Reputation: 47

How to align the text with the image that is besides to it?

I am struggling with aligning the text with the images that sits besides to it. I want to put an image with a text in the ASP.NET Ajax TabContainer (inside the TabPanel specifically) and I want this to works for this case and other cases. I searched a lot but most of the resources talked about special situations based on the height or width of the image. What about if I have more that one image with different dimensions.

So could you please help me in giving me such a way for aligning the text with any image?

My ASP.NET code:

<ajaxToolkit:TabPanel ID="ImagesGallery" runat="server" OnDemandMode="Once" Enabled="true" >
        <HeaderTemplate><img src="images/New/image.png" class="icon" alt=""  /> Images Gallery</HeaderTemplate>
</ajaxToolkit:TabPanel>

My CSS that I tried to make it works is:

/* For aligning the image (icon) with the text */
.icon
{
    display: block;
    margin-left: auto;
    margin-right: auto 
}

Upvotes: 1

Views: 2884

Answers (1)

Simon Arnold
Simon Arnold

Reputation: 16177

Use vertical-align:middle; on your image.
Here is an example with stackoverflow icon http://jsfiddle.net/tDfDP/

Hope this help

Upvotes: 1

Related Questions