Hello everyone,
Hope you enjoy using Glitch,
I have a problem with CSS,
My perfect rendering is on Chrome. But only on SAFARI I get this problem.
My :hover outline does not take into account the curvature (border-radius) of my div or the element (because I have the same problem on buttons etc…)
Does anyone know a glitch 
CSS code to add to force SAFARI to understand and add the border-radius of my outline?
It’s strange because SAFARI understand the border-radius of the classic border.
I’ve asked ChatGBP on it, who say to add : -webkit-border-radius: 8px; = I’ve tried but there is no change.
SAFARI rendering 
:
Here is my app : https://ableinfra.glitch.me/ (You can check on Chrome outline is showed with the perfect border-radius, due to stupid rules of the support I cannot add a second image to show it).
Here is some code :
.mydivstyles {
background-color: #ffffff;
border-top: solid 1px #ededed;
border-right: solid 1px #ededed;
border-left: solid 1px #ededed;
border-bottom: solid 1px #ededed;
border-radius: 6px !important;
margin-bottom: 22px !important;
margin-top: 15px !important;
padding-right: 13px;
padding-left: 6px;
padding-bottom: 5px;
min-height: 200px !important;
justify-content: center;
}
.mydivstyles:hover {
outline: 4px solid;
outline-color: rgb(236 236 236);
outline-style: solid;
outline-width: 4px;
border-radius: 6px !important;
}
