CSS 行クラスにより、一部の要素がフレーム外になりますが、要素は静的で表示の下部に固定される必要があります。

Question

現在のページは次のようになります。 2 つの要素が隣り合うように行クラスを追加すると、下部のナビゲーション バーがスクロールする必要がある位置まで押し下げられます。

ここでは、行要素のない別のページが表示されます。ナビゲーション リンクがディスプレイの下部に完全に貼り付けられています (植物と部屋のナビゲーション要素はリマインダー タブ (画像 1) に表示されるべきではないため、この要素の画像 2 は無視してください) ) ページはスクロール可能で、ナビゲーションバーが正しい位置に保たれますが、要素のアウトラインが正しくありません。すべての緑色のボックス表示は、編集ボタンと削除ボタンとともに重ねて表示される必要があります。図 1 で使用されている行クラスを使用してこれを修正しようとしましたが、結果として図 1 の問題が発生しました。

ここでは、[リマインダー]タブで達成したいことを確認できます

HTML に行要素があるときにこのエラーが発生する現在の CSS コードの何が問題なのか疑問に思っています。

この動作を防ぐ、項目を並べて表示するより良い方法をご存知の場合は、ぜひお知らせください。

リーリー

問題の原因となっているHTMLコードスニペット

リーリー

問題が他の場所にある場合は、HTML ページ全体とナビゲーション CSS コードを含めます。 リマインダーHTML

リーリー

ナビゲーションCSS

ああああ

Answer 1

コンテンツ全体を div 内に配置することで (以下のように幅 90%)、問題全体が解決されました。 リーリー