diff --git a/core/misc/vertical-tabs.js b/core/misc/vertical-tabs.js
index c7ad2fd..9a8bcc0 100644
--- a/core/misc/vertical-tabs.js
+++ b/core/misc/vertical-tabs.js
@@ -65,9 +65,6 @@
           tab_list.append(vertical_tab.item);
           $that
             .removeClass('collapsed')
-            // prop() can't be used on browsers not supporting details element,
-            // the style won't apply to them if prop() is used.
-            .attr('open', true)
             .addClass('vertical-tabs__pane')
             .data('verticalTab', vertical_tab);
           if (this.id === focusID) {
@@ -89,6 +86,14 @@
             tab_focus = $this.find('> .vertical-tabs__pane').eq(0);
           }
         }
+        // If open exists and that open has the data attr vertical tab then activate the first tab of the open object.
+        var $tab = $('[open]');
+        if (tab.length) {
+          var tabData = $tab.first().data('verticalTab');
+          if (tabData) {
+            tab_focus = $tab.first();
+          }
+        }
         if (tab_focus.length) {
           tab_focus.data('verticalTab').focus();
         }
@@ -151,6 +156,7 @@
         .siblings('.vertical-tabs__pane')
         .each(function () {
           var tab = $(this).data('verticalTab');
+          tab.details.attr('open', false);
           tab.details.hide();
           tab.item.removeClass('is-selected');
         })
@@ -158,6 +164,8 @@
         .show()
         .siblings(':hidden.vertical-tabs__active-tab')
         .val(this.details.attr('id'));
+
+      this.details.attr('open', true);
       this.item.addClass('is-selected');
       // Mark the active tab for screen readers.
       $('#active-vertical-tab').remove();