iphone - iphone とディスプレイ: インライン

Question

iOS6 を実行している iPhone4 でサイトをテストすると、奇妙な表示の問題が発生します。

何らかの理由で、iPhone はディスプレイを無視します: inline; 親リンクをクリックしたときのルール。Safari 開発者ツールを使用してテスト サイトを閲覧してきましたが、トグル クラス名は意図したとおりに機能しています。

このjavascriptを使用して、divのクラス名を切り替えています:

$('.toggle').click(function() {
$(this).toggleClass('toggle');
$(this).toggleClass('toggle_open');
});

マークアップは次のようになります。

<div class="toggle">
  <a href="#" class="level1"><span>Parent</span></a> 
    <div>
       <a href="#"><span>Child 1</span></a>
       <a href="#"><span>Child 2</span></a>
       <a href="#"><span>Child 3</span></a>
    </div>
</div>

CSS:

div.toggle div { display: none; }
div.toggle, div.toggle_open  { display: inline; }

display: inline を inline-block に変更すると機能します。display: inline を完全に削除すると機能しますが、ブラウザで表示の問題が発生します。display: inline; を使用したい したがって、必要に応じて、マークアップの内容が 1 行または 2 行で表示されます。

モディナイザーを使用して「タッチ」と「ノータッチ」のルールを作成できることはわかっていますが、これはおそらく私のコードによって作成されたバグである何かを殺しすぎているようです:)

モバイル Safari を混乱させるために何をしましたか?