CODEWITHSUNDEEP
c#asp.netwebforms
cool_spirit
cool_spirit

Reputation: 677

Adding style to asp.net label

I want to adding style to asp.net label, but it wont work.

ASP.NET Mark up
<asp:Label runat="server" ID="lblCommentText"/>

Generated from the backend: Html mark up
<span id="ctl02_ctl36_CommentText">Only the leave the comment please</span>

............................................

I want to add the following style to the label

{
 float:right;
 width:70%;
}

I've tried using

  1. cssClass property

  2. Add this lblCommentText.Attributes.CssStyle.Add("float", "right"); to backend

  3. using javascript
    document.getElementById('<%= lblCommentText.ClientID%>').Style.display = ("float","right");

  4. and also in-line style to the element

none of them works, can someone help me out ?

Upvotes: 18

Views: 87691

Answers (4)

Ercan Celik
Ercan Celik

Reputation: 1

asp:label is being converted to span. So, you can set

span { float:left }

Upvotes: 0

Kanisq
Kanisq

Reputation: 232

If you want to add from code behind then use like below: 

lblCommentText .Attributes.CssStyle.Add("float", "right");
lblCommentText.Attributes.CssStyle.Add("width", "70%");

If you want to add from aspx page then create a css class like:

.testClass{float: right;width: 70%;}

and assign like this: 

asp:Label runat="server" ID="lblCommentText" runat="server" Text="test data" CssClass="testClass"

Upvotes: 10

Irfan TahirKheli
Irfan TahirKheli

Reputation: 3662

Inline:

<asp:Label runat="server" ID="lblCommentText" style="float:right" />

Using class:

<style>
.styleclass{
   float: left;
}

</style>

<asp:Label runat="server" ID="lblCommentText" CssClass="styleclass" />

Using ID;

   <style>
    #ctl02_ctl36_CommentText {
       float: left;
    }

    </style>

 <asp:Label runat="server" ID="lblCommentText" />

Upvotes: 16

Abhitalks
Abhitalks

Reputation: 28437

Labels are rendered as spans and spans are basically inline elements. You need to make it block or inline-block in order to get the float and width have effect.

.yourclass {
    display: inline-block;
    float: right;
    width: 70%;
}

And then simply use cssclass:

<asp:Label runat="server" ID="lblCommentText" CssClass="yourclass" />

Upvotes: 24

Related Questions