Home/ Questions/Q 8874773
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T18:48:26+00:00

I have a comparatively simple website in terms of HTML and CSS and it

  • 0

I have a comparatively simple website in terms of HTML and CSS and it looks fine in Desktop browsers (IE9/Chrome). However when I view it in Internet Explorer in Windows Phone 7.5 it seems to make the text inside of unordered lists huge or tiny for some reason,

Here is code that produces weird results

<!DOCTYPE html>
<head>
<style type="text/css">
body {
  margin: 0px 0px;
}
h1 {
  font-size: 250%;
}
h2 {
  font-size: 150%;
}
h3 {
  font-size: 120%;
}
</style>
</head>
<body>

  <h1>H1 header</h1>
  <h2>H2 header</h2>
  <h3>H3 header</h3>
  <p>Some paragraph text</p>
  <ul>
    <li>List item 1</li>
    <li>List item 2</li>
  </ul>

</body>
</html>

Take a look at the size of the li text, it should be the size of the p tag but it is tiny. For a version of this file online see this link here

I have narrowed it down to the margin property on body and on a div, if either of these are set then the text proportions go crazy. Why does this happen? Is this a bug? I can work around this but it is far more convenient for me to set the margin on a container rather than all children individually

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Seems that internet Explorer mobile for Windows Phone 7 applies some kind of font-resizing to optimize the content, but this just ends up screwing up my site at least, see this PDF ‘Windows Explorer Mobile for Windows Phone 7 which explains briefly.

    To stop this behaviour, include this bit of CSS

    html {
   -ms-text-size-adjust: none;
}
    • 0