How I center my HTML iframe in Android webivew? – Blancer.com Tutorials and projects

I have an iframe in my Android webview that I am loading like this:

     String folderPath = "file:android_asset/";
     String fileName = "index.html";
     String file = folderPath + fileName;
     webView.loadUrl(file);

The iframe is loaded via HTML and CSS files located in my android/assests folder. The HTML and CSS look like this. HTML:

<!DOCTYPE html>
<html lang="en">
<body>
<link rel="stylesheet" type="text/css" href="default.css"  />
    <div class="abs-frame-container">
    <iframe 
      id="my_frame"
      src="my web page link"
      scrolling="no"
      allowtransparency="true" 
      style="border:none;overflow:hidden">
    </iframe>
    </div>
</body>
</html>

and my CSS

#my_frame {
  position: absolute;
  top: 0%;
  bottom: 0%;
  right: 0%;
  width: 117%;
  height: 100%;
}

#abs-frame-container{
    top: 10%;
    bottom: 0%;
    position: relative;
}

The webpage in iframe shows fine in the webview. I want to center (vertical alignment) my iframe in the webview so that it aligns automatically based on the webview dimensions (height). Would appreciate a lot if someone could help me how this can be achieved?