How Can I Prevent Font Size Changes in My iPhone Website During Orientation Shifts?

Preserving HTML Font Size During iPhone Orientation Changes

When displaying web pages on an iPhone, it's common to encounter changes in font size when switching between portrait and landscape orientations. To resolve this issue and maintain consistent hyperlink font sizes, consider the following solution:

HTML:

<ul>
    <li>

CSS:

ul li a {
    font-size: 14px;
    text-decoration: none;
    color: #cc9999;
}

To ensure that hyperlink font sizes remain unchanged regardless of orientation, add the following CSS property:

html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

This property disables the default behavior of automatically adjusting text sizes based on orientation. As a result, the hyperlink font size will persist at the specified value (14px in this case) even when switching between portrait and landscape modes.

The above is the detailed content of How Can I Prevent Font Size Changes in My iPhone Website During Orientation Shifts?. For more information, please follow other related articles on the PHP Chinese website!