Android Webview has extra white space at the bottom
<p>I'm using the following method with HTML to load a local image into webview</p>

<pre><code>   void loadingImage(WebView mWebView){
        mWebView.getSettings().setSupportZoom(false);
        mWebView.getSettings().setDisplayZoomControls(false);
        String mHead="&lt;html&gt;&lt;head&gt;&lt;style type='text/css'&gt;body{margin:auto auto;text-align:center;} img{width:100%25;} &lt;/style&gt;&lt;/head&gt;";
        String mBody = "&lt;body&gt; &lt;img src='my_image.jpg'/&gt; &lt;/body&gt;&lt;/html&gt;";
        mWebView.loadDataWithBaseURL("file:///android_res/drawable/", mHead + mBody, "text/html", "UTF-8", null);
        mWebView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
   }
</code></pre>

<p>And the XML part</p>

<pre><code>  &lt;WebView
        android:id="@+id/my_webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/&gt;     
</code></pre>

<p>But using this method I'm getting an extra white space at the bottom after scrolling down if the phone's orientation is portrait.</p>

<p>The image's width 1,5 times bigger than it's height, so as I understand <code>WebView</code> loads the image and by increasing height makes the content square(width and height equal) but increasing it just by adding an extra white space to the height.</p>

<p>But if phone's orientation is landscape, it works without any problem, without adding any white space.</p>

<p>So please help me to understand what is the actual reason of the problem and how to solve it.
Thank you in advance.</p>