diff --git a/packages/grafana-ui/src/components/Button/ButtonContent.tsx b/packages/grafana-ui/src/components/Button/ButtonContent.tsx
index 75ec567b6a9..70ea9d6bf5b 100644
--- a/packages/grafana-ui/src/components/Button/ButtonContent.tsx
+++ b/packages/grafana-ui/src/components/Button/ButtonContent.tsx
@@ -18,13 +18,22 @@ type Props = {
 export function ButtonContent(props: Props) {
   const { icon, className, iconClassName, children } = props;
   const styles = getStyles();
-  return icon ? (
-    <span className={cx(styles.content, className)}>
-      <i className={cx([icon, iconClassName])} />
-      &nbsp; &nbsp;
-      <span>{children}</span>
-    </span>
-  ) : (
-    <span className={styles.content}>{children}</span>
-  );
+  if (icon && children) {
+    return (
+      <span className={cx(styles.content, className)}>
+        <i className={cx([icon, iconClassName])} />
+        &nbsp; &nbsp;
+        <span>{children}</span>
+      </span>
+    );
+  }
+  if (icon) {
+    return (
+      <span className={cx(styles.content, className)}>
+        <i className={cx([icon, iconClassName])} />
+      </span>
+    );
+  }
+
+  return <span className={styles.content}>{children}</span>;
 }