tweak cancel buttons

src/registrar/assets/sass/_theme/_buttons.scss

@@ -101,7 +101,23 @@ a.usa-button--unstyled:visited {
   }
 }
 
-// WARNING: crazy hack ahead
+// Cancel button used on the
+// DNSSEC main page
+// We want to center this button on mobile
+// and add some extra left margin on tablet+
+.usa-button--cancel {
+  text-align: center;
+  @include at-media('tablet') {
+    margin-left: units(2);
+  }
+}
+
+
+// WARNING: crazy hack ahead:
+// Cancel button(s) on the DNSSEC form pages
+// We want to position the cancel button on the
+// dnssec forms next to the submit button
+// This button's markup is in its own form
 .btn-cancel {
   position: relative;
   top: -39.2px;

src/registrar/templates/domain_dnssec.html

@@ -33,7 +33,7 @@
         <a href="{% url 'domain-dns-dnssec-keydata' pk=domain.id %}" class="usa-button usa-button--outline">Add Key Data</a>
         <button
           type="submit"
-          class="usa-button usa-button--unstyled margin-left-2"
+          class="usa-button usa-button--unstyled usa-button--cancel"
           name="cancel_dnssec"
           id="cancel_dnssec"
       >Cancel</button>