Home/ Questions/Q 8711555
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T04:54:23+00:00

This one is messing with my head. The following HTML/CSS looks fine on every

  • 0

This one is messing with my head. The following HTML/CSS looks fine on every browser, expect when I read it on an iPhone. The text in the a tag(SITE DESIGN SOME COMPANY) is noticeably smaller by about 25%. I have gone up through the DOM and made sure no other styles are computing on my desktop.

<footer>
COPYRIGHT 2012 / <a href="http://somesite.com">
SITE DESIGN SOME COMPANY</a> / ALL RIGHTS RESERVED
</footer>      

footer {
width: 100%;
position: absolute;
padding: 10px 0 10px 0;
left: 0px;
bottom: -50px;
text-align: center;
word-spacing: 20px;
font-size: 75%;
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’ve experienced this, too. iPhone renders % font sizes differently than other browsers. Especially if nested inside multiple elements with multiple % changes (if your <footer> for example is inside another element with another 75% font size declaration).

    If you change 75% to 0.75em (or use something other than a percentage), you should be back in business.

    footer {
width: 100%;
position: absolute;
padding: 10px 0 10px 0;
left: 0px;
bottom: -50px;
text-align: center;
word-spacing: 20px;
font-size: 0.75em; /* or 10pt, or... */
}
    • 0