asp.net - 在网格中显示图像

Question

我正在使用 RadGrid 并且在这个网格中有带有 ImageUrl 的按钮。在 IE8 中，我在正确(水平)显示它们时遇到了一些问题，而不是像这样

所以我想我应该改变按钮的宽度，但后来发生了一些事情，我真的不知道为什么会这样......我刚刚将 width 从 20px 更改为 30px

有人可以帮助我如何改变它，就像在所有其他浏览器中一样正常(水平两个图像......

我的代码

 <telerik:RadGrid ID="rgGrid" runat="server" DataSourceID="SqlDataSource1" 
          AllowSorting="True" AllowPaging="True" PageSize="20" 
          AllowFilteringByColumn="True" ShowStatusBar="True" Width="100%" 
          CellSpacing="0" GridLines="None" OnItemCommand="rgGrid_ItemCommand">
     <MasterTableView AutoGenerateColumns="False" DataKeyNames="OrganisationId">
         <NoRecordsTemplate>
             Can't find Organisations to display
         </NoRecordsTemplate>
       <Columns>
           <telerik:GridBoundColumn DataField="OrganisationId" DataType="System.Int32" 
               FilterControlAltText="Filter OrganisationId column"
               HeaderText="OrganisationId" ReadOnly="True" SortExpression="OrganisationId" 
               UniqueName="OrganisationId" Visible="false">
           </telerik:GridBoundColumn>
           <telerik:GridBoundColumn DataField="OrganisationName" FilterControlAltText="Filter 
                    OrganisationName column" HeaderText="Name" ItemStyle-Width="60px" 
                    SortExpression="OrganisationName" UniqueName="OrganisationName">
               <ItemStyle Width="60px" />
           </telerik:GridBoundColumn>
           <telerik:GridBoundColumn DataField="CountryName" FilterControlAltText="Filter 
                    CountryName column" HeaderText="Country" ItemStyle-Width="60px" 
                    SortExpression="CountryName" UniqueName="CountryName">
                <ItemStyle Width="60px" />
           </telerik:GridBoundColumn>
           <telerik:GridTemplateColumn UniqueName="DeleteColumn" ItemStyle-Width="20px" 
                    AllowFiltering="false"ItemStyle-HorizontalAlign="Right"  >
              <ItemTemplate>
                 <telerik:RadButton ID="btnEdit" CommandName="Edit" runat="server" 
                      Width="30px" ToolTip="View Details" Height="20px" 
                      CommandArgument='<%# DataBinder.Eval(Container.DataItem, "OrganisationId")%>'>
                      <Image ImageUrl="~/Resources/Images/Grid/edit-app.png" 
                          IsBackgroundImage="true" />
                 </telerik:RadButton>
                 <telerik:RadButton ID="btnDelete" CommandName="Delete" runat="server" 
                      Width="20px" ToolTip="Delete Vacation"
                      Height="20px" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "OrganisationId")%>'>
                 <Image ImageUrl="~/Resources/Images/Grid/delete-app.png" 
                        IsBackgroundImage="true" />
               </telerik:RadButton>
           </ItemTemplate>
       </telerik:GridTemplateColumn>
    </Columns>
  </MasterTableView>
  </telerik:RadGrid>

感谢您的帮助和快速回答!!

Answer 1

先给image一个类:

<Image ImageUrl="~/Resources/Images/Grid/edit-app.png" 
IsBackgroundImage="true" CssClass="someclass" />

添加CSS

.someclass {
   background-repeat: no-repeat;
}

因为它被呈现为背景图像。