From a80b31bf98ca14279128ecbf32b13ba748e438fc Mon Sep 17 00:00:00 2001
From: Albin Larsson <mail@albinlarsson.com>
Date: Fri, 8 Jun 2018 13:31:29 +0200
Subject: [PATCH] Fix #1003: Formatted captions issue

---
 src/js/captions.js                | 2 +-
 src/js/defaults.js                | 1 +
 src/sass/components/captions.scss | 2 +-
 3 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/js/captions.js b/src/js/captions.js
index 0baa0820..b3723885 100644
--- a/src/js/captions.js
+++ b/src/js/captions.js
@@ -222,7 +222,7 @@ const captions = {
         if (changed) {
             // Empty the container and create a new child element
             utils.emptyElement(this.elements.captions);
-            const caption = utils.createElement('span');
+            const caption = utils.createElement('span', utils.getAttributesFromSelector(this.config.selectors.caption));
             caption.innerHTML = content;
             this.elements.captions.appendChild(caption);
 
diff --git a/src/js/defaults.js b/src/js/defaults.js
index 16df8624..b1bdaa65 100644
--- a/src/js/defaults.js
+++ b/src/js/defaults.js
@@ -328,6 +328,7 @@ const defaults = {
         },
         progress: '.plyr__progress',
         captions: '.plyr__captions',
+        caption: '.plyr__caption',
         menu: {
             quality: '.js-plyr__menu__list--quality',
         },
diff --git a/src/sass/components/captions.scss b/src/sass/components/captions.scss
index 9dfc2be8..8fce581a 100644
--- a/src/sass/components/captions.scss
+++ b/src/sass/components/captions.scss
@@ -21,7 +21,7 @@
     transition: transform 0.4s ease-in-out;
     width: 100%;
 
-    span {
+    .plyr__caption {
         background: $plyr-captions-bg;
         border-radius: 2px;
         box-decoration-break: clone;