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

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

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

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

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

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

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

ナビゲーションCSS