WKWebView increase font size without adding horizontal scroll

Question

So, the problem is following: We have simple text, :

Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text  NED test test Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text  NED test test Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text  NED test test 

And we use WKWebView for displaying it:

webView.loadHTMLString(text, baseURL: nil)

We will see the result like

As you see the font is quite small, so I want to increase it. If I try to do

    private func viewPortScript() -> WKUserScript {
        let viewPortScript = """
            var meta = document.createElement('meta');
            meta.setAttribute('name', 'viewport');
            meta.setAttribute('content', 'width=device-width');
            meta.setAttribute('initial-scale', '1.0');
            meta.setAttribute('maximum-scale', '1.0');
            meta.setAttribute('minimum-scale', '1.0');
            meta.setAttribute('user-scalable', 'no');
            document.getElementsByTagName('head')[0].appendChild(meta);
        """
        return WKUserScript(source: viewPortScript, injectionTime: .atDocumentEnd, forMainFrameOnly: true)
    }

or

document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust='200%'

It will increase the font, but we will see horizontal scroll in this case

Is there way to increase font size but without horizontal scroll

Answer 1

Find the issue...

webView.loadHTMLString(text.replacingOccurrences(of: " ", with: " "), baseURL: nil) 

We need to remove nbsp https://en.wikipedia.org/wiki/Non-breaking_space