Develop Reference

RadComboBox items becomes Transparent

I am having an amusing issue with one of my RadComboBoxes. It is connected to a skin that it utilized all through my web site. On everything except one page the RadComboBox looks and capacities effectively. However on one page, the background behind the select-able items becomes transparent.
This is what the definition looks like.
<telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBoxProduct" runat="server" Height="200" Width="415"
DropDownWidth="315" EmptyMessage="--Select--" HighlightTemplatedItems="true"
EnableLoadOnDemand="true" Filter="StartsWith" OnItemsRequested="RadComboBoxProduct_ItemsRequested" ForeColor="Black"
Label="Product:">
<ItemTemplate>
<div style="float: left; elevation: above; azimuth: rightwards; height: 12px; width: 20px; background-color: black">
<%# DataBinder.Eval(Container,"Attributes['CUSTOMER_SHORT_NAME_MARKETING']")%>
</div>
</ItemTemplate>
</telerik:RadComboBox>
Please help me on this.

Please review the skins troubleshooting article which could prove helpful - https://docs.telerik.com/devtools/aspnet-ajax/general-information/troubleshooting/skins-troubleshooting#incorrect-or-distorted-appearance
Some pro tips:
- make sure that it is not IE compatibility problem as well as the problem is not caused by global CSS styles
- start to remove the page contents one by one until you find what is causing the issue

Image Control Smaller Than Image Size

I have an image control that is displaying a logo on the page. The image is 500 x 500 pixels, but when this appears on screen the control shrinks it down to 19x20. I can't figure out how to override any CSS that is setting this smaller size, or how to generally make it bigger. If I use Google Chrome, Inspect and then edit the attributes I can see that it should be fine, I just can't get it to run properly.
Here are some code snippets from my site:
ASPX:
<asp:Image ID="imgLogo" runat="server" Height="500" Width="500" CssClass="logoImage" ImageAlign="Middle" /> <p></p>
The CSS I'm using is:
logoImage {
width: 500px;
height: 500px;
}
The generated mark-up is:
<img id="mainContentPlaceHolder_imgLogo" class="logoImage" skindid="btnCSV" src="../App_Themes/Main/images/logo.gif" align="middle" style="height:19px;width:20px;">
The image URL is set in the code behind.

Your class definition is missing a dot. Also try adding !important attribute:
.logoImage {
width: 500px !important;
height: 500px !important;
}
But do try find out where that height:19px;width:20px comes from (maybe from mainContentPlaceHolder size or from in-code assignment).

How do I customize an asp:Button class?

How do I customize an asp:Button class?
This is like this proble: How to set css style to asp.net button? but not really since the button is inherited from a cs class.
I have this bit of code in an ASPX file:
<div class="buttonContainer" style="clear:both;width:100%;text-align:left">
<asp:Button ID="btnProceed" runat="server" Text="Next" OnClick="ProceedButton_Clicked" Enabled="true" />
</div>
So, if I want to make the button bigger or bolder text, how would I do it?
btnProceed is defined in a .cs file like this:
protected global::System.Web.UI.WebControls.Button btnProceed;
So, is there some way I can inherit a System.Web.UI.WebControls.Button class and change the font size?

All your server controls are ultimately going to render some HTML markup to the browser. So Apply a CSS class to your button and style it the way you want. You can use the CssClass property to set it.
<asp:Button ID="btnProceed" runat="server" Text="Hi" CssClass="yourClass" />
And put this style in your css file which is being included in your aspx page.
.yourClass
{
font-size:72px;
font-weight:bold;
}

You could be able to customize any style for your button with this
.buttonContainer input
{
font-size: 14px;
font-weight: bold;
/**** ETC ***** /
}

you can set Font Size at server-side by using btnProceed.Font.Size = FontUnit.Point(50);

Is there a way to make a scrollable gridview without putting it inside a div?

I know a gridview can be made scrollable by including it inside a div and making the overflow to auto. But I'm using tables to align my page and found out that it's not necessarily a good idea to put a div inside a td, so are there any other way around it?

you can use this library. it's crosss browser and work seamlessly. Scrolling grid
<yourNameSpace:ScrollingGrid runat="server" ID=sg1
Width=450 Height=240 CssClass=sgTbl>
<asp:DataGrid runat="server" ID=Grid2 CellPadding=5 CellSpacing=1
AutoGenerateColumns=True AllowSorting=True
AllowPaging=True PageSize=35>
<HeaderStyle BackColor=red ForeColor=white Font-Bold=True />
<ItemStyle BackColor=#fefefe />
<AlternatingItemStyle BackColor=#eeeeee />
<PagerStyle BackColor=silver ForeColor=White
Mode=NumericPages />
</asp:DataGrid>
</yourNameSpace:ScrollingGrid>
this will automatically make your gridview scrollable with fixed header.

As gridview is reader as table.
Try using the overflow CSS property. There are also separate properties to define the behavior of just horizontal overflow (overflow-x) and vertical overflow (overflow-y).
Since you only want the vertical scroll, try this:
table {
height: 500px;
overflow-y: scroll;
}
EDIT:
Apparently <table> elements don't respect the overflow property. This appears to be because <table> elements are not rendered as display: block by default (they actually have their own display type). You can force the overflow property to work by setting the <table> element to be a block type:
table {
display: block;
height: 500px;
overflow-y: scroll;
}
Note that this will cause the element to have 100% width, so if you don't want it to take up the entire horizontal width of the page, you need to specify an explicit width for the element as well.

How to make image in left side of text in asp.net button?

I am using ASP.NET in my project. In that I have add a Button With Background Image.
But Image is Locating on Button Left Site As the Below Image Show. I want to make This Image in Very near to the Text.(As I Marked). The Text is in Center of the Button. Is any Way to Do This?.,
COde -
<asp:Button ID="btnKotAdd" runat="server" Text="Kot Addtion"
onclick="btnKotAdd_Click"
style="margin-left: 10%; background-image: url('Images/add.png'); background-repeat:no-repeat; height:35px;"
width="80%" Font-Overline="False" />
Thanks In advance.

You have to adjust the background-position of your button image as per your requirement. like this:
style="margin-left: 10%;
background-image: url('Images/add.png');
background-repeat:no-repeat;
height:35px;
background-position:30% 0;"