diff --git a/app/assets/stylesheets/moderators.scss b/app/assets/stylesheets/moderators.scss
index 7052db7dc..2c95246b4 100644
--- a/app/assets/stylesheets/moderators.scss
+++ b/app/assets/stylesheets/moderators.scss
@@ -41,6 +41,15 @@
         border-width: 1px 0;
         display: grid;
         grid-template-columns: 4fr 2fr 1fr;
+        .article-title {
+          color: var(--base-90);
+          min-width: 0;
+          header > h3 {
+            text-overflow: ellipsis;
+            overflow: hidden;
+            white-space: nowrap;
+          }
+        }
         .mod-article-tag {
           color: var(--base-80);
           padding-right: var(--su-2);
@@ -707,6 +716,10 @@
 
 #mod-center-other-options svg {
   width: var(--su-3);
+  height: var(--su-3);
+  &:hover {
+    cursor: pointer;
+  }
 }
 
 .mod-feedback {
diff --git a/app/javascript/modCenter/singleArticle/index.jsx b/app/javascript/modCenter/singleArticle/index.jsx
index 42e1a0b75..45aa42d43 100644
--- a/app/javascript/modCenter/singleArticle/index.jsx
+++ b/app/javascript/modCenter/singleArticle/index.jsx
@@ -31,12 +31,14 @@ export default class SingleArticle extends Component {
     const { articleOpened } = this.state;
     const { id, title, publishedAt, cachedTagList, user, key } = this.props;
     const tags = cachedTagList.split(', ').map((tag) => {
-      return (
-        <span className="mod-article-tag fs-s ff-accent lh-base" key={key}>
-          <span className="article-hash-tag">#</span>
-          {tag}
-        </span>
-      );
+      if (tag) {
+        return (
+          <span className="crayons-tag" key={key}>
+            <span className="crayons-tag__prefix">#</span>
+            {tag}
+          </span>
+        );
+      }
     });
 
     const newAuthorNotification = user.articles_count <= 3 ? '👋 ' : '';
diff --git a/app/javascript/modCenter/singleArticle/singleArticle.test.jsx b/app/javascript/modCenter/singleArticle/singleArticle.test.jsx
index 50125a62f..fdd04a424 100644
--- a/app/javascript/modCenter/singleArticle/singleArticle.test.jsx
+++ b/app/javascript/modCenter/singleArticle/singleArticle.test.jsx
@@ -1,10 +1,11 @@
+/* eslint-disable jest/expect-expect */
 import { h } from 'preact';
 import { axe } from 'jest-axe';
 import { render, getNodeText, fireEvent } from '@testing-library/preact';
 
 import SingleArticle from './index';
 
-const testArticle = {
+const testArticle1 = {
   id: 1,
   title: 'An article title',
   path: 'an-article-title-di3',
@@ -16,11 +17,25 @@ const testArticle = {
   },
 };
 
+const testArticle2 = {
+  id: 2,
+  title:
+    'An article title that is quite very actually rather extremely long with all things considered',
+  path:
+    'an-article-title-that-is-quite-very-actually-rather-extremely-long-with-all-things-considered-fi8',
+  publishedAt: '2019-06-24T09:32:10.590Z',
+  cachedTagList: '',
+  user: {
+    articles_count: 1,
+    name: 'howdy',
+  },
+};
+
 describe('<SingleArticle />', () => {
-  const renderSingleArticle = (article = testArticle) =>
+  const renderSingleArticle = (article = testArticle1) =>
     render(
       <SingleArticle
-        id={article.title}
+        id={article.id}
         title={article.title}
         path={article.path}
         publishedAt={article.publishedAt} // renders as Jun 28
@@ -29,7 +44,7 @@ describe('<SingleArticle />', () => {
       />,
     );
 
-  it('should have no a11y  violations', async () => {
+  it('should have no a11y violations', async () => {
     const { container } = renderSingleArticle();
     const results = await axe(container);
     expect(results).toHaveNoViolations();
@@ -38,7 +53,7 @@ describe('<SingleArticle />', () => {
   it('renders the article title', () => {
     const { queryByText } = renderSingleArticle();
 
-    expect(queryByText(testArticle.title)).toBeDefined();
+    expect(queryByText(testArticle1.title)).toBeDefined();
   });
 
   it('renders the tags', () => {
@@ -49,10 +64,16 @@ describe('<SingleArticle />', () => {
     expect(queryByText('beginners')).toBeDefined();
   });
 
+  it('renders no tags or # symbol when article has no tags', () => {
+    const { container } = renderSingleArticle(testArticle2);
+    const text = getNodeText(container.querySelector('.article-title'));
+    expect(text).not.toContain('#');
+  });
+
   it('renders the author name', () => {
     const { container } = renderSingleArticle();
     const text = getNodeText(container.querySelector('.article-author'));
-    expect(text).toContain(testArticle.user.name);
+    expect(text).toContain(testArticle1.user.name);
   });
 
   it('renders the hand wave emoji if the author has less than 3 articles ', () => {
@@ -70,9 +91,9 @@ describe('<SingleArticle />', () => {
   it('renders the correct formatted published date as a time if the date is the same day', () => {
     const today = new Date();
     today.setSeconds('00');
-    testArticle.publishedAt = today.toISOString();
+    testArticle1.publishedAt = today.toISOString();
 
-    const { queryByText } = renderSingleArticle(testArticle);
+    const { queryByText } = renderSingleArticle(testArticle1);
     const readableTime = today.toLocaleTimeString().replace(':00 ', ' '); // looks like 8:05 PM
 
     expect(queryByText(readableTime)).toBeDefined();
@@ -85,9 +106,9 @@ describe('<SingleArticle />', () => {
     expect(iframes.length).toEqual(2);
 
     const [articleIframe, actionPanelIframe] = iframes;
-    expect(articleIframe.src).toContain(testArticle.path);
+    expect(articleIframe.src).toContain(testArticle1.path);
     expect(actionPanelIframe.src).toContain(
-      `${testArticle.path}/actions_panel`,
+      `${testArticle1.path}/actions_panel`,
     );
   });
 
@@ -95,12 +116,12 @@ describe('<SingleArticle />', () => {
     const toggleArticle = jest.fn();
     const { container } = render(
       <SingleArticle
-        id={testArticle.title}
-        title={testArticle.title}
-        path={testArticle.path}
-        publishedAt={testArticle.publishedAt} // renders as Jun 28
-        cachedTagList={testArticle.cachedTagList}
-        user={testArticle.user}
+        id={testArticle1.id}
+        title={testArticle1.title}
+        path={testArticle1.path}
+        publishedAt={testArticle1.publishedAt} // renders as Jun 28
+        cachedTagList={testArticle1.cachedTagList}
+        user={testArticle1.user}
         toggleArticle={toggleArticle}
       />,
     );