私はデスクトップ上で水平で、モバイルで垂直に整列する応答メニューを作っています。 Desktop-Versionには問題はありませんが、Mobileバージョンは実際には変な動作をします。垂直メニュー（+サブメニュー）が不自然にスタックする
だから、これは携帯電話のメニューです。第1レベルのエントリは青色で第2レベルはグレーで表示されます。画像には、たとえ3枚あっても2枚目の2枚の画像しか見ることができません。もう1つの問題は、これらが第1レベルのエントリではなく、メニューの最後にあることです。それは非常に少なくとも、それはしない、適切にスタックする必要があることで
すべての要素が
display: block;
position: relative;
float: left;
width: 100%;
を持っています。それは私が取り組んでいるフレームワークの一部なので、CSSファイルはかなり巨大で、読みにくいかもしれません。
http://codepen.io/anon/pen/JEPYYW
これは、あなたが探している答えではないかもしれないが、私はそれがとにかく役に立てば幸い...個人的に
、私は（今ではないので）新しいCSS柔軟ボックスを使用しますあなたがもっと簡単に望むものを達成するためのレイアウトは、https://css-tricks.com/snippets/css/a-guide-to-flexbox/に大きなガイドがあります。
基本的に、（他のオプションの中でも）デスクトップサイトにはflex-direction: columnがあり、モバイルビューではrowに切り替わります。これは、メニューの向きを水平方向から垂直方向に切り替えるだけです。
私の意見では、これはこれを行う最も良い（そして最も現代的な）方法です。しかし、ブラウザのサポートがより伝統的な方法ほど良くないと主張する人がいることは注目に値する。これは当てはまりますが、http://caniuse.com/#feat=flexboxを見ると、現代のブラウザーではうまくいきます。
あなたの問題を直接解決することはできませんが、これは便利です
それは素晴らしいです。フレックスの使用はあまり考えていませんでしたが、本当に有望です。私はflexを使用するように変更し、うまくいけば更新します。 –
あなたの答えのおかげでflexを使うようにシステムを更新しました。しかし、悲しいことに、この問題はまだ残っています。フレックスが何をすることができるか知ってくれてありがとう:) –
問題を再現するのに十分なHTMLとCSSを提供する必要があります。 –
完全にリンクを追加するのを忘れてしまった。お知らせをいただき、ありがとうございます。 –