Add a Button Toolbar to a Form

You can add a button toolbar to a form. In this example, the toolbar displays at the bottom of the form.

<%@ Control %>
  <style>
    .container
    {      width: 100%;
      top: 0px;
      bottom: 0px;
      position: absolute;    }

    .myContentDiv
    {      width: 100%;
      top: 0px;
      bottom: 100px;
      position: absolute;
      overflow: auto;    }

    .Toolbar
    {      border-top: 3px solid #59acd7;
      width: 100%;
      bottom: 0px;
      height: 97px;
      position: absolute;
      text-align: right; ;    }

    .toolbarBtn
    {      top: 23px;
      right: 23px;
      align: right;
      width: 57px;
      height: 57px;
      cursor: pointer;
      background-position: 0 0;    }
  </style>

  <div class="container">
    <div class="myContentDiv">

<sq:Form runat="server" ID="UACT1Form" DataKeyNames="fldId"
DataSourceID="UACT1DataSource"  >
  ...        
    </sq:Form>
<sq:DataSource runat="server" ID="UACT1DataSource"
  QueryName="UACT1" EnableInsert="True" EnableUpdate="True" EnableDelete="True" >
</sq:DataSource>
<sq:BoundControl runat="server" TargetControlID="UACT1Form"></sq:BoundControl>
    </div>

    <div class="Toolbar">
      <sq:button id="Button2" runat="server" text="Cancel" cssclass="toolbarBtn" style="background: url(/shared resources/images/organization.png);" ToolTip="Cancel" CommandName="Cancel" CommandArgument="1">
<Image EnableImageButton="True"></Image>
</sq:button>
      <sq:button id="Button1" runat="server" text="Submit" cssclass="toolbarBtn" style="background: url(/shared resources/images/started.png);" ToolTip="Submit" CommandName="Save" CommandArgument="1">
<Image EnableImageButton="True"></Image>
</sq:button>    </div>  </div>