Home/ Questions/Q 8086607
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-05T18:30:23+00:00

The logo on my friends website is working properly in all browsers yet when

  • 0

The logo on my friends website is working properly in all browsers yet when I open up my iPhone or iPad (actual devices) it’s all wonky. 

<a href="http://www.averylawoffice.ca/averywordpress"><img class="averylogo" src="<?php bloginfo('template_directory') ?>/img/HEADER-AveryLawOffice-LOGO.png" alt="Avery Law Office"></a>

It’s not placed in any containing div. Just on it’s own.

CSS

 .averylogo { position: absolute; width:360px; left: 50%; margin-left: -180px; z-index: 2; }

I’m not quite sure why it works everywhere else but doesn’t center on my iPad or iPhone properly.

This is what it’s looking like, but only on the iOS.
enter image description here

What am I doing wrong?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Give #main-navigation position:relative; otherwise the logo is positioned relative to the body, which is resized on your smaller device.

    Chris Coyier has an article about it.

    • 0