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:
protected
void
RadGridMain_ItemCreated(
object
sender, GridItemEventArgs e)
{
if
(e.Item
is
GridHeaderItem)
{
GridHeaderItem headerItem = (GridHeaderItem)e.Item;
GridTableView table = headerItem.OwnerTableView;
GridColumn column = table.GetColumnSafe(
"AddTeamPositionColumn"
);
if
(column !=
null
)
{
ImageButton addTeam =
new
ImageButton();
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:GridButtonColumn
ButtonType
=
"ImageButton"
ItemStyle-Wrap
=
"true"
CommandName
=
"addNestedItem"
Text
=
"Add new team position"
ImageUrl
=
"~/Images/Volunteer/AddPos.png"
ButtonCssClass
=
"MyImageButton"
UniqueName
=
"AddTeamPositionColumn"
>
<
HeaderStyle
Width
=
"25px"
VerticalAlign
=
"Middle"
></
HeaderStyle
>
<
ItemStyle
HorizontalAlign
=
"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?