Fixed terribly annoying issues with back button. Back button is now on

the bottom of the hint div, no matter what.

common/lib/xmodule/xmodule/css/crowdsource_hinter/display.scss

@@ -37,8 +37,3 @@
   overflow: hidden;
   position: relative;
 }
-
-.bottom {
-  position: absolute;
-  bottom: 0;
-}
\ No newline at end of file

common/lib/xmodule/xmodule/js/src/crowdsource_hinter/display.coffee

@@ -48,7 +48,7 @@ class @Hinter
     else
       @$(target).css('display', 'none')
     # Fix positioning errors with the bottom class.
-    @$('.bottom').removeClass('bottom').addClass('bottom')
+    @set_bottom_links()
 
   vote: (eventObj) =>
     # Make an ajax request with the user's vote.
@@ -87,6 +87,15 @@ class @Hinter
     @$('#blank-answer').html(@answer)
     @go_to('p3')
 
+  set_bottom_links: =>
+    # Makes each .bottom class stick to the bottom of .wizard-viewbox
+    @$('.bottom').css('margin-top', '0px')
+    viewbox_height = parseInt(@$('.wizard-viewbox').css('height'), 10)
+    @$('.bottom').each((index, obj) ->
+      view_height = parseInt($(obj).parent().css('height'), 10)
+      $(obj).css('margin-top', (viewbox_height - view_height) + 'px')
+    )
+
   render: (content) =>
     if content
       # Trim leading and trailing whitespace
@@ -127,8 +136,10 @@ class @Hinter
     translate_string = 'translateX(' +id_to_index[view_id] * -1 * parseInt($('#' + view_id).css('width'), 10) + 'px)'
     @$('.wizard-container').css('transform', translate_string)
     @$('.wizard-container').css('-webkit-transform', translate_string)
+    @set_bottom_links()
 
   legacy_go_to: (view_id) ->
     # For older browsers - switch wizard views by changing the screen.
     @$('.wizard-view').css('display', 'none')
-    @$('#' + view_id).css('display', 'block')
\ No newline at end of file
+    @$('#' + view_id).css('display', 'block')
+    @set_bottom_links()
\ No newline at end of file

common/templates/hinter_display.html

@@ -77,9 +77,9 @@
           <a class="answer-choice" href="javascript: void(0)" value="${answer}">${answer}</a><br />
       % endfor
       % if hints_exist:
-        <!-- A placeholder for the Back button, which is relatively-positioned -->
-        <p> &nbsp </p>
-        <a href="javascript: void(0);" class="wizard-link bottom" dest="p1"> Back </a>
+        <p class="bottom">
+          <a href="javascript: void(0);" class="wizard-link" dest="p1"> Back </a>
+        </p>
       % endif
 
     </div>
@@ -127,8 +127,9 @@ Write your hint here.  Please don't give away the correct answer.
           <a href="http://www.apa.org/education/k12/misconceptions.aspx?item=2" target="_blank">Learn even more</a>
         </p>
       </div>
-      <br />
-      <a href="javascript: void(0);" class="wizard-link" dest="p2"> Back </a>
+      <p class="bottom">
+        <a href="javascript: void(0);" class="wizard-link" dest="p2"> Back </a>
+      </p>
     </div>
   <!-- Close wizard contaner and wizard viewbox. -->
   </div></div>