开发者

How to align two form submits

开发者 https://www.devze.com 2022-12-17 17:21 出处:网络
I have a page with two submit buttons at the bottom of the page.One for the submit of the page that posts to an action and another to cancel that posts to a different action.For whatever reason IE has

I have a page with two submit buttons at the bottom of the page. One for the submit of the page that posts to an action and another to cancel that posts to a different action. For whatever reason IE has a problem with placing these two buttons side by side. Firefox has no issue.

Here is my script:

<div class="button_row">
   using (Html.BeginForm("Edit", "Design"))
   { %> 
   <div class="button_cell_left">
      <input type="submit" value="Update" /> 
   </div>
   <% } %>
   <% Html.EndForm(); %> 

   using (Html.BeginForm("Review", "Design"))
   { %> 
   <div class="button_cell_right">
       <input type="submit" value="Cance开发者_StackOverflowl"/>
  </div> 
  <% } %> 
  <% Html.EndForm(); %>

Here is the css for those classes:

.button_row { float:left; width: 100%; }
.button_cell_left {float:left; width: 20%; }
.button_cell_right {float:left; width: 20%;  }

The 20% width is plenty room wise for those buttons. Like i said in ie they won't stay on the same line but in firefox they will. My question is why given my code?

Thanks in advance, Billy


You need to float the forms they're wrapped in as well, IE doesn't implement float properly, so if you want 2 floats on the same line, they must both be floated. This issue was annoying me yesterday as well

New CSS:

.button_row { float:left; width: 100%; }
.button_row form {float:left; width: 20%; }


Set a width in pixels, not %. IE have problems with % at times.


Your first input is missing it's self-closing slash.

0

精彩评论

暂无评论...
验证码 换一张
取 消