Improve layout of buttons on contributor terms page

diff --git a/app/views/user/terms.html.erb b/app/views/user/terms.html.erb
index 5dac8f69284050f1ab480983594b61547b9eecd4..049e07ca7d0b71adca4671446946e7fda4ca65ca 100644 (file)
--- a/app/views/user/terms.html.erb
+++ b/app/views/user/terms.html.erb
@@ -25,7 +25,7 @@
   <%= render :partial => "terms" %>
 </div>
 
-<% form_tag :action => 'save' do %>
+<% form_tag({:action => "save"}, { :id => "termsForm" }) do %>
   <p>
     <label for="confirm_pd_checkbox"><%= t 'user.terms.consider_pd' %></label>
     <%= check_box('user', 'consider_pd') %>
@@ -38,9 +38,9 @@
     <%= hidden_field('user', 'display_name') %>
     <%= hidden_field('user', 'pass_crypt') %>
     <%= hidden_field('user', 'pass_crypt_confirmation') %>
-    <div class="left_right_line">
-      <div class="left"><%= submit_tag(t('user.terms.decline'), :name => "decline") %></div>
-      <div class="right"><%= submit_tag(t('user.terms.agree'), :name => "agree") %></div>
+    <div id="buttons">
+      <%= submit_tag(t('user.terms.decline'), :name => "decline", :id => "decline") %>
+      <%= submit_tag(t('user.terms.agree'), :name => "agree", :id => "agree") %>
     </div>
   </p>
 <% end %>

diff --git a/public/stylesheets/common.css b/public/stylesheets/common.css
index d46013393a230ea2e3e71d5930d189fb69db0a33..8435fd01f57631df9e199822c1a1a92b1a8ef6bc 100644 (file)
--- a/public/stylesheets/common.css
+++ b/public/stylesheets/common.css
@@ -569,6 +569,18 @@ div#contributorTerms img {
   margin-top: 10%;
 }
 
+form#termsForm {
+  width: 80%;
+}
+
+form#termsForm div#buttons {
+  float: right;
+}
+
+form#termsForm input#agree {
+  margin-left: 50px;
+}
+
 /* Rules for the account settings page */
 
 #accountForm td {
@@ -746,35 +758,3 @@ abbr.geo {
 .table1 { 
   background: #fff;
 }
-
-/* hack to get left/right alignment on a line working. apparently still works in IE too.
- * shamelessly stolen from http://www.spartanicus.utvinternet.ie/left_and_right_alignment_using_css.htm
- */
-div.left_right_line { 
-    text-align:right;
-    margin:1em 0;
-    padding:0;
-    width:80%;
-}
-div.left_right_line div {
-    display:inline;
-    white-space:nowrap
-}
-div.left_right_line div.left {
-    float:left
-}
-#content>div.left_right_line {
-    display:table;
-    width:60%
-}
-#content>div.left_right_line div { 
-    display:table-cell
-}
-#content>div.left_right_line div.left {
-    float:none;
-    text-align:left
-}
-#content>div.left_right_line div.right {
-    text-align:right
-}
-