Android WebView에서 테이블을 올바르게 표시하지 않습니다.

Question

웹 사이트를 표시하는 간단한 WebView 앱이 있습니다. 문제는 언제 WebView가 항상 테이블을 올바르게 표시하지 않는지 API 16에서 앱을 실행할 때입니다. 앱을 몇 번 다시 시작하면 결국에는 정상적으로로드됩니다. 외관상으로는 무작위로, 그것은 테이블에 미친듯한 일을 할 것입니다. 또한 API 19, 20 및 21에서이 앱을 실행했지만 문제가 발생하지 않았습니다.

이 잘로드

:

그리고 그렇지 않은 경우 아래

프로젝트에서 코드 내 조각이다. 또한 manifest에서 인터넷 사용 권한과 loadUrl을 사용하도록 설정 한 javascript와 같은 기본 사항이 있음을 유의해야합니다. 웹보기에서

activity_main.xml

<?xml version="1.0" encoding="utf-8"?> 
<WebView xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@+id/activity_main_webview" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 
</WebView> 

MainActivity.java

public class MainActivity extends Activity { 

private WebView mWebView; 

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 

    mWebView = (WebView) findViewById(R.id.activity_main_webview); 

    // Enable Javascript 
    WebSettings webSettings = mWebView.getSettings(); 
    webSettings.setJavaScriptEnabled(true); 

    webSettings.setDomStorageEnabled(true); 
    mWebView.loadUrl("http://www.mywebsite.com/page.html"); 

} 

HTML 로딩

<div style="z-index: 5001; position: fixed; width: 100%; top: 0px; background-color: white;"> 
<table style="width: 100%; text-align: center;"> 
<tbody> 
<tr> 
<td style="border: 1px solid silver;" id="menu1-t" ><img style="width: 100%; max-width: 60px;" src="images/image.png" ></td> 
<td style="border: 1px solid silver;" id="menu2-t" ><img style="width: 100%; max-width: 60px;" src="images/image.png" ></td> 
<td style="border: 1px solid silver;" id="menu3-t" ><img style="width: 100%; max-width: 60px;" src="images/image.png" ></td> 
<td style="border: 1px solid silver;" id="menu4-t" ><img style="width: 100%; max-width: 60px;" src="images/image.png" ></td> 
<td style="border: 1px solid silver;" id="menu5-t" ><img style="width: 100%; max-width: 60px;" src="images/image.png" ></td> 
<td style="border: 1px solid silver;" id="menu6-t" ><img style="width: 100%; max-width: 60px;" src="images/image.png" ></td> 
</tr> 
</tbody> 
</table> 
</div> 

누구든지 전에 이것을 보았거나 아이디어가 있다면, 도움을 많이 주시면 감사하겠습니다.

Answer 1

내 테이블에 table-layout: fixed과 box-sizing: border-box을 추가하는 것만으로 문제가 해결 된 것 같습니다.