Ios13 and ionic 4 all html elements have black border

Hi

I am facing a problem on my ionic4 app with ios13 users which is black border around all html elements on the page.

what is the solution? can it be solved by css?

Similar here. Black border on all icon buttons.

It seems about WKWebView: Black borders on is

I just used the default web view i didn’t make any changes, also the link from 2015 I think many changes happened we cannot rely on it, don’t we?

Normal webview (UIWebView) is deprecated with Ios13. New one is WKWebView. So changes are coming from both side, ios and ionic. So it’s probably similar problem with that old post.

Blog Post: https://ionicframework.com/blog/understanding-itms-90809-uiwebview-api-deprecation/

the problem is also shown in pwa website on ios13 not just on app, so webview is not related to the problem.

I guess, it’s about Webview. But new one. WKWebView. iOS 13 still supports UIWebView but default is WK. I guess it use both of them because i use normal Webview but in XCode i see these:

09

Btw, i get black border only around icon buttons when they are clicked.

Same problem… Any suggestions?

did you solve it?

please let me know if you did it

so what is the process to solve it!

I tried everything but no success. I’m using latest versions of Ionic & Angular. I guess we need a cordova update. You can try to open an issue at ionic github for official answer.

I also don’t have fix for this. I suggest its css issue.

1 Like

This weekend i created same project twice, with Cordova & Capacitor. I got same border effect on buttons. So it’s not about Webview/WKWebview difference. Probably just CSS.

Does setting outline:none; on elements with border make any difference?