diff --git a/web_translate_dialog/static/src/css/base.css b/web_translate_dialog/static/src/css/base.css
index cd0709fe8..b75e85c50 100644
--- a/web_translate_dialog/static/src/css/base.css
+++ b/web_translate_dialog/static/src/css/base.css
@@ -7,3 +7,6 @@
 .oe_translation_field.touched {
   border: 1px solid green !important;
 }
+.modal-xl {
+  max-width: 90%;
+}
diff --git a/web_translate_dialog/static/src/js/web_translate_dialog.js b/web_translate_dialog/static/src/js/web_translate_dialog.js
index 31f13fe90..4ff62dddc 100644
--- a/web_translate_dialog/static/src/js/web_translate_dialog.js
+++ b/web_translate_dialog/static/src/js/web_translate_dialog.js
@@ -25,10 +25,7 @@ var translateDialog = Dialog.extend({
     template: "TranslateDialog",
     init: function(parent, options) {
         this._super(parent,
-                    {title: _t("Translations"),
-                     width: '90%',
-                     height: '80%'}
-                    );
+                    {title: _t("Translations"), size: 'x-large'});
         this.view_language = session.user_context.lang;
         this.view = parent;
         this.view_type = parent.viewType || '';
@@ -42,6 +39,14 @@ var translateDialog = Dialog.extend({
                                 [['translatable', '=', '1']])).read_slice(['code', 'name'],
                                 { sort: 'id' }).then(this.on_languages_loaded);
     },
+    willStart: function () {
+        var self = this;
+        return this._super.apply(this, arguments).then(function () {
+            if (self.size == 'x-large') {
+                self.$modal.find('.modal-dialog').addClass('modal-xl');
+            }
+        });
+    },
     on_languages_loaded: function(langs) {
         this.languages = langs;
         this.languages_loaded.resolve();