Struggling to Understand the Relationship Between Frame Size and Viewport Size in UIWebView

iOS Simulator 8.4
Here's how to create a UIWebView that's slightly smaller than the screen,
CGSize displaySize = screenSize; int leftOffsetPercent = 5; int topOffsetPercent = 5;CGRect webViewFrame = CGRectMake( displaySize.width / 100 * leftOffsetPercent, displaySize.height / 100 * topOffsetPercent, displaySize.width / 100 * (100 - leftOffsetPercent * 2), displaySize.height / 100 * (100 - topOffsetPercent * 2) ); self.webView = [[UIWebView alloc] initWithFrame:webViewFrame];
When I loaded and displayed an HTML with a ViewPort Meta specified like this:
<meta name="viewport" content="width=device-width, initial-scale=1">
A horizontal scroll bar appeared, and the content did not fit within the WebView.
Since it's an iPhone 6, displaySize.width is 375, and webView.frame.size.width is 337.5. It seems that the viewport's device-width is judged to be this 375.
Out of curiosity, when I obtained window.innerWidth within the browser, it was 338, but when I checked document.body.clientWidth, it was 375. I couldn't understand why this was happening.
I was puzzled about how to remove the horizontal scroll bar, but in the end, I tried dynamically rewriting the meta tag in the HTML as follows:
var viewPortMeta = $('meta[name="viewport"]');
viewPortMeta.attr('content', "width=" + (window.innerWidth - 1) + ", initial-scale=1");
Although I think it's a rather forceful method, it worked. The horizontal scroll bar disappeared.
Related posts
Get the Effective Height and Width of the Browser When the Software Keyboard Appears in iOS Safari and Adjust the Layout
When Duplicate Symbol _OBJC_CLASS_ Appears in Large Numbers During iOS App Build
When Building with Xcode 7, ERROR ITMS-90096: "Your binary is not optimized for iPhone 5 ..." Appears
When Using CarouFredSel on iOS, the Touch Transition Stopped Working Unexpectedly
We look forward to discussing your development needs.