0

友達のウェブサイトのロゴはすべてのブラウザで正しく機能していますが、iPhoneまたはiPad（実際のデバイス）を開くと、すべてが不安定です。

<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>

含まれているdivには配置されません。それだけで。

CSS

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

なぜそれが他のどこでも機能するのかよくわかりませんが、iPadやiPhoneの中心に正しくありません。

これはそれがどのように見えるかですが、iOS上でのみです。 ここに画像の説明を入力してください

私は何が間違っているのですか？

4

2 に答える 2

1

それ#main-navigation position:relative;以外の場合、ロゴは本体に対して配置され、小さいデバイスではサイズが変更されます。

Chris Coyier の記事があります。

于 2012-06-11T21:08:52.993 に答える
0

使用margin-left: autoして削除しleft: 50%ます。

for IEに追加することもできtext-align: centerます。#main-navigation

于 2012-06-11T21:12:36.853 に答える