Vertical Align Image and Text inside an HTML Table using CSS

Last Reply on Mar 12, 2014 11:07 PM By Azim

Posted on Mar 12, 2014 03:56 AM

I have Lable and image in my page that bind lable from database and I didn't define width for lable and Hight for Div becuse width of lable is changable and if text of label  be more than div width   text continue in second line...

I set lable and image like below

 

but when text be morethan 1 line it will be like below

 

but I want my image be top of div like below

How I can do it

Best regards

Neda

Posted on Mar 12, 2014 11:07 PM Modified on on Mar 14, 2014 11:49 PM

This is what you want,

HTML:

<table id="TableState">
    <tr>
        <td>
            <asp:Label ID="lbladd" runat="server" Text="This is Test This is Test This is Test This is Test This is Test This is Test This is Test This is Test "
                CssClass="lbladd2"></asp:Label>
        </td>
        <td class="tdS1">
            <asp:Image ID="imgadd" runat="server" ImageUrl="~/image/add.png" CssClass="imgaddC" />
        </td>
    </tr>
</table>

CSS:

<style type="text/css">
    #TableState
    {
        width: 500px;
    }
        
    .tdS1
    {
        float: right;
        width: 100px;
        text-align: right;
    }
</style>

Thank You.