diff --git a/src/ol/control/FullScreen.js b/src/ol/control/FullScreen.js
index 2ed725b96c..8e3b685412 100644
--- a/src/ol/control/FullScreen.js
+++ b/src/ol/control/FullScreen.js
@@ -165,6 +165,7 @@ class FullScreen extends Control {
 
     const tipLabel = options.tipLabel ? options.tipLabel : 'Toggle full-screen';
     this.button_.setAttribute('type', 'button');
+    this.setClassName_(this.button_, this.isInFullscreen_);
     this.button_.title = tipLabel;
     this.button_.appendChild(this.labelNode_);
 
diff --git a/test/browser/spec/ol/control/fullscreen.test.js b/test/browser/spec/ol/control/fullscreen.test.js
index fed0db292a..417c44556e 100644
--- a/test/browser/spec/ol/control/fullscreen.test.js
+++ b/test/browser/spec/ol/control/fullscreen.test.js
@@ -7,4 +7,23 @@ describe('ol.control.FullScreen', function () {
       expect(instance).to.be.an(FullScreen);
     });
   });
+
+  describe('the fullscreen button', function () {
+    describe('when inactiveClassName is not set', function () {
+      it('is created with the default inactive classname set on the button', function () {
+        const instance = new FullScreen();
+        const button = instance.button_;
+        expect(button.className).to.equal('ol-full-screen-false');
+      });
+    });
+    describe('when inactiveClassName is set', function () {
+      it('is created with the desired inactive classnames set on the button', function () {
+        const instance = new FullScreen({
+          inactiveClassName: 'foo bar',
+        });
+        const button = instance.button_;
+        expect(button.className).to.equal('foo bar');
+      });
+    });
+  });
 });