--- a/mobile/android/base/resources/layout-large-v11/browser_toolbar.xml
+++ b/mobile/android/base/resources/layout-large-v11/browser_toolbar.xml
@@ -111,14 +111,15 @@
 
     <!-- We draw after the menu items so when they are hidden, the cancel button,
          which is thus drawn on top, may be pressed. -->
     <org.mozilla.gecko.widget.ThemedImageView
             android:id="@+id/edit_cancel"
             style="@style/UrlBar.ImageButton.Icon"
             android:layout_alignParentRight="true"
             android:src="@drawable/close_edit_mode_selector"
+            android:background="@drawable/action_bar_button"
             android:paddingLeft="2dp"
             android:paddingRight="2dp"
             android:contentDescription="@string/edit_mode_cancel"
             android:visibility="gone"/>
 
 </merge>

--- a/mobile/android/base/resources/layout/browser_toolbar.xml
+++ b/mobile/android/base/resources/layout/browser_toolbar.xml
@@ -93,16 +93,17 @@
     <!-- Note that the edit components are invisible so that the views
          depending on their location can properly layout. -->
     <org.mozilla.gecko.widget.ThemedImageView
             android:id="@+id/edit_cancel"
             style="@style/UrlBar.ImageButton.Icon"
             android:layout_alignParentRight="true"
             android:src="@drawable/close_edit_mode_selector"
             android:contentDescription="@string/edit_mode_cancel"
+            android:background="@drawable/action_bar_button"
             android:visibility="invisible"/>
 
     <!-- The space to the left of the cancel button would be larger than the right because
          the url bar drawable contains some whitespace, so we compensate by removing
          some padding from the right (value determined through experimentation). -->
     <org.mozilla.gecko.toolbar.ToolbarEditLayout android:id="@+id/edit_layout"
                   style="@style/UrlBar.Button"
                   android:layout_alignLeft="@id/url_bar_entry"