如何將按鈕放在CSS圖像旁邊？

在我的asp.net頁面上，我有一些Update Pannel。爲了避免異步回發問題，我必須將我的Print Button放在面板之外，但所有其他標籤和按鈕的圖像仍在此面板內，所以我想要控制CSS中的頁面樣式，以便將btnPrint放在image1的旁邊。如何將按鈕放在CSS圖像旁邊？

這裏是我的頁面佈局：

<div id="Toolbar"> 
    <asp:UpdatePanel ID="UpdateToolbar" runat="server" UpdateMode="Conditional"> 
     <ContentTemplate> 
      <asp:Label ID="Label3" runat="server" Text=" Months: "></asp:Label>&nbsp; 
      <asp:DropDownList ID="ddlMonth" runat="server"></asp:DropDownList> 

      <asp:Label ID="Label2" runat="server" Text=" Year: "></asp:Label>&nbsp; 
      <asp:DropDownList ID="ddlYear" runat="server"></asp:DropDownList> 
      <b id="buttonWrap">> 
       <asp:Image ID="Image2" runat="server" ImageUrl="Images/DefRefreshBtn.png" Width="15" 
        Height="20" />&nbsp; 
       <asp:LinkButton ID="btnRefresh" runat="server" OnClick="btnRefresh_Click1">Refresh</asp:LinkButton>&nbsp;&nbsp;&nbsp; 
       <asp:Image ID="Image1" runat="server" ImageUrl="Images/DefPrintBtn.png" Width="27" 
        Height="20" /> 
      </b>     
     </ContentTemplate> 
    </asp:UpdatePanel> 
    <asp:LinkButton ID="btnPrint" runat="server" onclick="btnPrint_Click" CssClass="printBtn">Print</asp:LinkButton>&nbsp;&nbsp;&nbsp; 
</div>

目前，我使用這個CssClass="printBtn"：

.printBtn 
{ 
    position: relative; 
    top: -23px; 
    right: -700px; 
    font-weight: bold; 
}

但這種硬編碼可能導致問題在不同的瀏覽器。是否有任何方法可以在CSS中指定我的按鈕在image1旁邊？

來源

2014-05-19 Bryuk

實際輸出HTML。 –

向我們展示了HTML的實際渲染，請不要使用'asp'代碼作爲設計師想回答您的問題的人 – Viscocent

您將需要使用絕對定位。更好的解決方案是將其保留在UpdatePanel中，但使打印按鈕執行完整的回發。爲此，您可以用PostBackTrigger

下面是例子如何做一個完整的回傳需要 Force certain controls to do a full postback?

來源

2014-05-19 15:43:56 IanS

這應該是一個評論，而不是一個答案。 –

但它是一個答案 – IanS

我不同意....這是一個建議。你不知道任何關於實際的HTML，所以絕對位置可能不合適。 –

如何將按鈕放在CSS圖像旁邊？

回答

相關問題