diff --git a/frontend/src/components/side-nav-footer.js b/frontend/src/components/side-nav-footer.js
index fb3c6a4da9..d219332bb0 100644
--- a/frontend/src/components/side-nav-footer.js
+++ b/frontend/src/components/side-nav-footer.js
@@ -25,8 +25,9 @@ class About extends React.Component {
     return (
       <div>
         <a href="#" className="item" onClick={this.toggle}>{gettext('About')}</a>
-        <Modal isOpen={this.state.modal} toggle={this.toggle} className={this.props.className}>
+        <Modal isOpen={this.state.modal} centered={true} toggle={this.toggle} className={this.props.className}>
           <ModalBody>
+            <button type="button" className="close" onClick={this.toggle}><span aria-hidden="true">×</span></button>
             <div className="about-content">
               <p><img src="/media/img/seafile-logo.png" title="Private Seafile" alt="logo" width="128" height="32" /></p>
               <p>{gettext('Server Version: ')}6.3.3<br />© 2018 {gettext('Seafile')}</p>