This is a migrated thread and some comments may be shown as answers.

Inconsistent behavior of RadTextbox css class?

4 Answers 134 Views
Input
This is a migrated thread and some comments may be shown as answers.
Boris
Top achievements
Rank 1
Boris asked on 25 Feb 2013, 06:19 PM
I have a RadTextBox on the screen and I am trying to customize the label as illustrated in .http://www.telerik.com/help/aspnet-ajax/input-adding-labels.html.  I'm not sure I understand what I'm seeing.

It looks to me like some but not all aspects of the css class are being implemented in the box label.  I can set colors but so far I have been unable to set the font size or boldness. 

Suggestions?

4 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 26 Feb 2013, 09:39 AM
Hello Boris,

Try the following code to set the font size and boldness of the RadTextBox Label.

ASPX:
<telerik:RadTextBox ID="RadTextBox1" runat="server" Label="Name:" LabelCssClass="MyLabelStyle">
</telerik:RadTextBox>

CSS:
<style type="text/css">
    label.MyLabelStyle.riLabel
    {
        font-size:18px;
        font-weight:bold;
    }
</style>

Thanks,
Shinu.
0
Boris
Top achievements
Rank 1
answered on 26 Feb 2013, 02:22 PM
Still no good.  (Quite frankly I've only recently returned to web development and I'm not comfortable with CSS. The bulk of my work focuses on business logic and SQL.  That said, I've checked the main css file and it has no references to labels at all that I can see.  I can't find anything that might be overriding my local setting here.  It's very minimal in any case.)

Here's what I have so far.
I'm going to attach an image file.  My problem is that I want the textboxes to have roughly the same size and font as the two combo boxes they're next to.  (I even jacked it up to 36px without effect.)

The css. (This is local, same page as the controls.)
 label.MyLabelStyle.riLabel {
            background: inherit;
            color: black;
            font-size: 18px;
            font-weight: bold;
        }

Here's the HTML (There's also a couple of validators I've left out, but I don't see how they could affect display.):
<telerik:RadComboBox ID="ddlCat" runat="server" DataMember="CategoryId" DataTextField="CatDesc" DataValueField="CatId" OnClientSelectedIndexChanged="checkForNewUser" Height="200px" Label="Category" Sort="Ascending" NoWrap="True" Font-Size="Large" Skin="Simple" Width="275px" Font-Names="Arial"></telerik:RadComboBox>
                                      
<telerik:RadComboBox ID="ddlUrg" runat="server" DataMember="UrgencyLevelId" DataTextField="UrgencyDesc" Height="200px"
         DataValueField="UrgencyLevelId" Label="Urgency" Font-Size="Large" Skin="Simple" Width="225px" Font-Names="Arial">
</telerik:RadComboBox>                                        

<telerik:RadTextBox ID="txtLocation" runat="server" Label="Loc/Cube#" Width="250px"  Font-Names="Arial" Font-Size="Large" LabelCssClass="MyLabelStyle" ></telerik:RadTextBox>
 
<telerik:RadTextBox ID="txtPhone" runat="server" Label="Phone#/Ext" Width="250px" Font-Names="Arial" Font-Size="Large"  LabelCssClass="riLabel MyLabelStyle"></telerik:RadTextBox>



  
0
Shinu
Top achievements
Rank 2
answered on 27 Feb 2013, 06:54 AM
Hello Boris,

Please have a look at the following mark up which works fine at my end.

ASPX:
<head runat="server">
    <title></title>
    <style type="text/css">
        label.MyLabelStyle.riLabel
        {
            font-size: large;
            font-family: Arial;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div>
        <telerik:RadComboBox ID="ddlCat" runat="server" DataMember="CategoryId" DataTextField="CatDesc"
            AllowCustomText="true" DataValueField="CatId" Label="Category" Sort="Ascending"
            Font-Size="Large" Skin="Simple" Font-Names="Arial">
        </telerik:RadComboBox>
        <telerik:RadComboBox ID="ddlUrg" runat="server" DataMember="UrgencyLevelId" DataTextField="UrgencyDesc"
            AllowCustomText="true" DataValueField="UrgencyLevelId" Label="Urgency" Font-Size="Large"
            Skin="Simple" Font-Names="Arial">
        </telerik:RadComboBox>
        <telerik:RadTextBox ID="txtLocation" runat="server" Label="Loc/Cube#" Width="250px"
            Font-Names="Arial" Font-Size="Large" LabelCssClass="MyLabelStyle">
        </telerik:RadTextBox>
        <telerik:RadTextBox ID="txtPhone" runat="server" Label="Phone#/Ext" Width="250px"
            Font-Names="Arial" Font-Size="Large" LabelCssClass="MyLabelStyle">
        </telerik:RadTextBox>
    </div>
    </form>
</body>
</html>

Thanks,
Shinu.
0
Boris
Top achievements
Rank 1
answered on 27 Feb 2013, 02:04 PM
I'm more confused than ever.

The only way I could get the label to display right in VS was to add the attribute Skin="" to the textboxes.

Once I did that it looked OK in the designer.

However when I run the program (in any browser.  We're currently using Chrome, IE, and Firefox.)  the labels are unchanged.

Thanks for your effort but let's just forget about this.  Much ado about nothing.  I set the label width to 0 and put in separate ordinary ASP.Net label controls.  Problem solved.  
Tags
Input
Asked by
Boris
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Boris
Top achievements
Rank 1
Share this question
or