I have a radgrid in which I have added an image button to the header in the code behind. Here is where I am adding the button:
protectedvoidRadGridMain_ItemCreated(objectsender, GridItemEventArgs e) { if(e.Item isGridHeaderItem) { GridHeaderItem headerItem = (GridHeaderItem)e.Item; GridTableView table = headerItem.OwnerTableView; GridColumn column = table.GetColumnSafe("AddTeamPositionColumn"); if(column != null) { ImageButton addTeam = newImageButton(); addTeam.ID = "btnAddTeam"; addTeam.ImageUrl = "~/Images/Volunteer/AddPos.png"; addTeam.ToolTip = "Add new team"; headerItem["AddTeamPositionColumn"].Controls.Add(addTeam); addTeam.CommandName = "initInsert"; headerItem.Style["vertical-align"] = "middle"; } } }This works fine, but in firefox and chrome the button appears at the very bottom of the header with blank space above it (pls see attached images). It looks fine in IE. I have tried all sorts of things to effect the alignment and nothing has any effect at all. Here is the html of the column:
<telerik:GridButtonColumnButtonType="ImageButton"ItemStyle-Wrap="true"CommandName="addNestedItem"Text="Add new team position" ImageUrl="~/Images/Volunteer/AddPos.png"ButtonCssClass="MyImageButton"UniqueName="AddTeamPositionColumn"> <HeaderStyleWidth="25px"VerticalAlign="Middle"></HeaderStyle> <ItemStyleHorizontalAlign="Center"VerticalAlign="Middle"CssClass="MyImageButton"></ItemStyle></telerik:GridButtonColumn>
Does anyone know what I can do to make the image button added in the code behind be centered?