Black line appearing at bottom of UIWebView. How to remove?

Question 1

Black line appearing at bottom of UIWebView. How to remove?

html ios css uiwebview

HowsItStack · Jan 29, 2014 · Viewed 14.6k times · Source

Answer

Answer

I had same issue and solution is given below :

Set UIWebView's opaque to NO
Set UIWebView's backgroundcolor to clear color.

Note : Both things provided above are necessary.

Other solutions while using above one

webView.scrollView.backgroundColor = UIColor.whiteColor()

OR

The meta to go in the head tag of HTML

<meta name="viewport" content="initial-scale=1, maximum-scale=1">

Question 2

I am rendering some html in a webview that is embedded in a table cell. For some reason there is a black line at the bottom of the webview. I tried setting the background color of the webview and its scrollview to white but this did not change anything. Has anyone seen this before? UIWebView with black line at bottom

Here is the HTML that is being rendered:

<html>
<head>

    <style type="text/css">
a {text-decoration:none;background-color:white;}
    </style>

    <title></title>
</head>

<body style="margin:0;padding:0;background-color:white;">
    <a href="http://body/" style=
    "font-family:HelveticaNeue-Light;font-size:20.000000;color:black;-webkit-tap-highlight-color:rgba(0,0,0,0);">
    Portland Blazers vs Golden State Warriors | FULL Highlights | January 26 ,
    2014 | NBA 2013-14 Season</a><span style=
    "font-family:HelveticaNeue;font-size:12.000000;color:rgb(102,102,102);white-space:nowrap;"><a href="https://www.youtube.com/watch?v=2TfldZ4w57E&amp;feature=youtube_gdata_player"
    style=
    "font-family:HelveticaNeue;font-size:12;color:rgb(102,102,102);-webkit-tap-highlight-color:rgba(0,0,0,0);"><img height="12"
    src="file:[email protected]" width="20">www.youtube.com</a></span>
</body>
</html>

This is on iOS7.

UPDATE: I'm still not sure what is causing the black line to appear but I managed to get rid of it by changing how I setup my layout constraints. Before I was setting constraints for the spacing around the views and letting the layout system figure out the size that the view should be. I changed it to explicitly set a height constraint of the webview when the webview finishes loading its content. This seems to have fixed the issue but I still do not understand where the black line was coming from.

Black line appearing at bottom of UIWebView. How to remove?

Answer

Related questions