From 330513e74798caf37bc74ff80f11db1dc8209f8a Mon Sep 17 00:00:00 2001
From: Itay Yehezkel <Itay@Itays-Macbook-Pro.local>
Date: Mon, 28 Oct 2019 00:21:40 +0200
Subject: [PATCH 1/2] add warning when using  disabled button in safari

---
 docs/src/pages/components/tooltips/tooltips.md | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/docs/src/pages/components/tooltips/tooltips.md b/docs/src/pages/components/tooltips/tooltips.md
index 03290ce436a9bc..41e52bb46b583f 100644
--- a/docs/src/pages/components/tooltips/tooltips.md
+++ b/docs/src/pages/components/tooltips/tooltips.md
@@ -73,10 +73,14 @@ A tooltip can be interactive. It won't close when the user hovers over the toolt
 
 ## Disabled Elements
 
+
 By default disabled elements like `<button>` do not trigger user interactions so a `Tooltip` will not activate on normal events like hover. To accommodate disabled elements, add a simple wrapper element, such as a `span`.
 
+> ⚠️ In order to work with Safari, you need at least one display block or flex item below the tooltip wrapper.
+> 
 {{"demo": "pages/components/tooltips/DisabledTooltips.js"}}
 
+
 > If you're not wrapping a Material-UI component that inherits from `ButtonBase`, for instance, a native `<button>` element, you should also add the CSS property *pointer-events: none;* to your element when disabled:
 
 ```jsx

From eccaf597362404a824e451b0283268637b2918ba Mon Sep 17 00:00:00 2001
From: Itay Yehezkel <Itay@Itays-Macbook-Pro.local>
Date: Mon, 28 Oct 2019 00:23:04 +0200
Subject: [PATCH 2/2] Remove some spaces

---
 docs/src/pages/components/tooltips/tooltips.md | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/docs/src/pages/components/tooltips/tooltips.md b/docs/src/pages/components/tooltips/tooltips.md
index 41e52bb46b583f..529ff1e4a42b36 100644
--- a/docs/src/pages/components/tooltips/tooltips.md
+++ b/docs/src/pages/components/tooltips/tooltips.md
@@ -73,13 +73,11 @@ A tooltip can be interactive. It won't close when the user hovers over the toolt
 
 ## Disabled Elements
 
-
 By default disabled elements like `<button>` do not trigger user interactions so a `Tooltip` will not activate on normal events like hover. To accommodate disabled elements, add a simple wrapper element, such as a `span`.
 
 > ⚠️ In order to work with Safari, you need at least one display block or flex item below the tooltip wrapper.
-> 
-{{"demo": "pages/components/tooltips/DisabledTooltips.js"}}
 
+{{"demo": "pages/components/tooltips/DisabledTooltips.js"}}
 
 > If you're not wrapping a Material-UI component that inherits from `ButtonBase`, for instance, a native `<button>` element, you should also add the CSS property *pointer-events: none;* to your element when disabled: