diff --git a/bundle/latex2html5.bundle.js b/bundle/latex2html5.bundle.js
index ffe0d80..2567407 100644
--- a/bundle/latex2html5.bundle.js
+++ b/bundle/latex2html5.bundle.js
@@ -2086,10 +2086,10 @@ var LaTeX2HTML5 = (() => {
       return contents;
     },
     img: matchrepl(/\\img\{([^}]*)\}/, function(m) {
-      return '<div style="width: 100%;text-align: center;"><img src="' + m[1] + '"></div>';
+      return '<div class="latex2js-figure"><img src="' + m[1] + '"></div>';
     }),
     youtube: matchrepl(/\\youtube\{([^}]*)\}/, function(m) {
-      return '<div style="width: 100%;text-align: center;"><iframe width="560" height="315" src="https://www.youtube.com/embed/' + m[1] + '" frameborder="0" allowfullscreen></iframe></div>';
+      return '<div class="latex2js-figure"><iframe width="560" height="315" src="https://www.youtube.com/embed/' + m[1] + '" frameborder="0" allowfullscreen></iframe></div>';
     }),
     href: matchrepl(/\\href\{([^}]*)\}\{([^}]*)\}/, function(m) {
       return '<a href="' + m[1] + '">' + m[2] + "</a>";
diff --git a/bundle/latex2js.css b/bundle/latex2js.css
index 3ae5f55..a08c09d 100644
--- a/bundle/latex2js.css
+++ b/bundle/latex2js.css
@@ -22,6 +22,11 @@ svg {
   margin: var(--latex2js-parskip) auto;
 }
 
+.latex2js-figure {
+  margin: var(--latex2js-parskip) auto;
+  text-align: center;
+}
+
 .enumerate {
   list-style: circle;
   padding: 12px;
diff --git a/packages/css/latex2js.css b/packages/css/latex2js.css
index 3ae5f55..a08c09d 100644
--- a/packages/css/latex2js.css
+++ b/packages/css/latex2js.css
@@ -22,6 +22,11 @@ svg {
   margin: var(--latex2js-parskip) auto;
 }
 
+.latex2js-figure {
+  margin: var(--latex2js-parskip) auto;
+  text-align: center;
+}
+
 .enumerate {
   list-style: circle;
   padding: 12px;
diff --git a/packages/latex2js/latex2js.css b/packages/latex2js/latex2js.css
index 3ae5f55..a08c09d 100644
--- a/packages/latex2js/latex2js.css
+++ b/packages/latex2js/latex2js.css
@@ -22,6 +22,11 @@ svg {
   margin: var(--latex2js-parskip) auto;
 }
 
+.latex2js-figure {
+  margin: var(--latex2js-parskip) auto;
+  text-align: center;
+}
+
 .enumerate {
   list-style: circle;
   padding: 12px;
diff --git a/packages/latex2js/src/lib/text.ts b/packages/latex2js/src/lib/text.ts
index 6bd849a..5a47d8d 100644
--- a/packages/latex2js/src/lib/text.ts
+++ b/packages/latex2js/src/lib/text.ts
@@ -90,14 +90,14 @@ export const Functions = {
   },
   img: matchrepl(/\\img\{([^}]*)\}/, function(m: RegExpMatchArray) {
     return (
-      '<div style="width: 100%;text-align: center;"><img src="' +
+      '<div class="latex2js-figure"><img src="' +
       m[1] +
       '"></div>'
     );
   }),
   youtube: matchrepl(/\\youtube\{([^}]*)\}/, function(m: RegExpMatchArray) {
     return (
-      '<div style="width: 100%;text-align: center;"><iframe width="560" height="315" src="https://www.youtube.com/embed/' +
+      '<div class="latex2js-figure"><iframe width="560" height="315" src="https://www.youtube.com/embed/' +
       m[1] +
       '" frameborder="0" allowfullscreen></iframe></div>'
     );
diff --git a/packages/latex2js/test/figure.test.ts b/packages/latex2js/test/figure.test.ts
new file mode 100644
index 0000000..3dd3a47
--- /dev/null
+++ b/packages/latex2js/test/figure.test.ts
@@ -0,0 +1,18 @@
+import LaTeX2JS from '../src';
+
+const render = (tex: string): string => {
+  const parsed: any = new LaTeX2JS().parse(tex);
+  return parsed.map((segment: any) => (segment.lines || []).join('\n')).join('\n');
+};
+
+describe('raster figure wrappers', () => {
+  it.each([
+    ['\\img{figure.png}', '<div class="latex2js-figure"><img src="figure.png"></div>'],
+    [
+      '\\youtube{video-id}',
+      '<div class="latex2js-figure"><iframe width="560" height="315" src="https://www.youtube.com/embed/video-id"',
+    ],
+  ])('uses the figure class for %s', (tex, expected) => {
+    expect(render(tex)).toContain(expected);
+  });
+});