diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index 9bb218fceb2..535a5be2b62 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -3444,15 +3444,15 @@ body.oe_single_form .oe_single_form_container {
   padding-right: 0px;
   font-size: 13px;
 }
-.openerp .btn.btn-xs.btn-default {
-  color: #333333;
-  text-decoration: none !important;
-  float: none;
+.openerp .btn-group.state {
+  padding-top: 3px;
 }
-.openerp .btn-group:focus, .openerp .btn-group:hover {
-  padding: 1px 5px;
-  border: 1px solid #98999b;
-  display: inline;
+.openerp .btn-group.state a {
+  color: #333333;
+}
+.openerp .btn-group.state a:hover {
+  text-decoration: none;
+  color: #333333;
 }
 .openerp .status {
   display: inline-block;
diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass
index c95272cddb5..8873752d4d2 100644
--- a/addons/web/static/src/css/base.sass
+++ b/addons/web/static/src/css/base.sass
@@ -2783,15 +2783,13 @@ body.oe_single_form
         padding-left: 5px
         padding-right: 0px
         font-size: 13px
-    .btn.btn-xs.btn-default
-        color: #333
-        text-decoration: none !important
-        float: none
-    .btn-group:focus, .btn-group:hover
-        padding: 1px 5px
-        border: 1px solid #98999B
-        display: inline
-
+    .btn-group.state
+        padding-top: 3px
+    .btn-group.state a
+        color: #333333
+    .btn-group.state a:hover
+        text-decoration: none
+        color: #333333
     .status
         display: inline-block
         position: relative
diff --git a/addons/web/static/src/js/view_form.js b/addons/web/static/src/js/view_form.js
index 62367ad4fff..a7d8c09ea58 100644
--- a/addons/web/static/src/js/view_form.js
+++ b/addons/web/static/src/js/view_form.js
@@ -2348,6 +2348,10 @@ instance.web.form.DropdownSelection = instance.web.form.FieldChar.extend({
         data['states'] = self.prepare_dropdown_selection();
         this.$el.html(QWeb.render("DropdownSelection", data));
         this.$el.find('.oe_legend').click(self.do_action.bind(self));
+        this.$el.on('mouseenter mouseleave', function(e) {
+            self.$el.find('.caret').toggleClass('hidden', e.type == 'mouseleave');
+        });
+        
     },
     do_action: function(e) {
         var self = this;
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index f7dd56f7f5f..08d66d92567 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -1009,11 +1009,11 @@
 </t>
 
 <t t-name="DropdownSelection">
-    <span class="btn-group">
+    <span class="btn-group state">
         <t t-foreach="states" t-as="rec">
             <a t-att-class="rec.state_icon" t-if="widget.get('value') === rec.name" t-att-title="rec.state_name" >
-                <a t-att-class="'oe_legend dropdown-toggle'" data-toggle="dropdown">
-                <span class="caret"></span>
+                <a class="oe_legend dropdown-toggle" data-toggle="dropdown">
+                <span class="caret hidden"></span>
                 <span class="sr-only">Toggle Dropdown</span> </a>
             </a>
         </t>
diff --git a/addons/web_kanban/static/src/js/kanban.js b/addons/web_kanban/static/src/js/kanban.js
index b78b5c9db60..934de72c570 100644
--- a/addons/web_kanban/static/src/js/kanban.js
+++ b/addons/web_kanban/static/src/js/kanban.js
@@ -1330,6 +1330,9 @@ instance.web_kanban.DropdownSelection = instance.web_kanban.AbstractField.extend
         data['states'] = self.prepare_dropdown_selection();
         this.$el = $(QWeb.render("DropdownSelection", data));
         this.$el.find('.oe_legend').click(self.do_action.bind(self));
+        this.$el.on('mouseenter mouseleave', function(e) {
+            self.$el.find('.caret').toggleClass('hidden', e.type == 'mouseleave');
+        });
     },
     do_action: function(e) {
         var self = this;