HTML button not working after adding css to a h3

Question

I wanted my h3 to be aligned with my buttons so I made its position absolute and a couple other things. If you want to view the problem you can go here. I don't know anything else I could use to describe the problem. Oh and the show is Once Upon A Time Season 5. Any help will be appreciated greatly.

Answer 1

Try these changes in your html code

<form method="get">
  <h3 class="watching_what">
    <button class="change" style="float:left;" type="submit" name="episode_num" value="0">Previous</button>
        You Are Watching Episode 1          
    <button class="change" style="float:right;" type="submit" name="episode_num" value="2">Next</button>
  </h3>
</form>

And in your css code remove the transform property

.watching_what 
{
  text-align: center;
  color: 003099;
  position: absolute;
  /* position: element(#target); */
  /* transform: translateY(-100%); */
  left: 0px;
  right: 0px;
  padding-top: 18pt;
  padding-bottom: 18pt;
}