CODEWITHSUNDEEP
c#wpfwebviewwindows-phone-8.1
Tim Bee
Tim Bee

Reputation: 2230

WebView Component doesn't handle style in a consistent manner

I cannot begin to understand how the Windows Phone 8.1 "WebView" Component handle styles. I display some very static HTML, nothing fancy, and I did not set any particular CSS style.

Nevertheless, the HTML Tags seem to be handled differently and show up each with a different size or sometimes even a different font.

Here are two examples. On the one on the left, the paragraph written very small is an imbricated pre/code block whereas on the image on the right, it is a simple HTML table.

<pre>
    <code>
    ...
    <code>
</pre>

This issue happens with a whole lot of tags, ul/li and blockquotes are doing the same for instance.

I tried handling them each with a CSS rule... which works, but requires different rules / font-size for each tag...

Any idea how to do this?

enter image description here

Upvotes: 2

Views: 360

Answers (2)

Geekygecko
Geekygecko

Reputation: 3972

Another method I found to fix this is to set the viewport with the following:

<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    ...

Upvotes: 1

XU Weijiang
XU Weijiang

Reputation: 78

I encountered the same problem. After several days investigation, I found the CSS style -ms-text-size-adjust is the cause.

By default, -ms-text-size-adjust is auto, and IE will scale the content with some algorithm (mainly the contents that can't wrap, like pre, table, etc, have smaller font size ). If you instead set -ms-text-size-adjust to other value (like 100%, 200%), the problem will disappear.

Upvotes: 1

Related Questions