週間予定表を作成中です。時間とグリッドの背景としてテーブルがあり、position: absolute と float: left に設定されたブロックがあります。ブロックが表示されていますが、重なり合っています。オーバーラップしている 5 つのブロックがあるとします。これらの 5 つのブロックのサイズを変更して、同じスペースを占めるようにする方法が必要です。これをさらに困難にしているのは、これらの 5 つがすべて互いに重なっていない可能性があることです。例えば：
最初の画像の重なりに注目してください。重なっている場合は、適切な間隔で配置する必要があります。これが理にかなっているのかどうかはよくわかりません。これが本当に紛らわしい場合は、より明確にしようとします。基本的に、さまざまな人からの複数の予定を表示する週のカレンダーに一連の時間ブロックを表示する方法が必要です。前述のように、これらのブロックは position: absolute と float: left であることを覚えておいてください。これは、テーブルの上にピクセル単位で配置されるためです。解決策については、javascriptまたはHTMLでかまいませんが、あまり気にしませんが、後でドラッグを追加する必要があることに注意してください。ボックスをドラッグした場合に、その場で並べ替える方法が必要です重なる。
アップデート
クイックアップデートとして。私の図では、それが例です。そのフォーマットで重複するボックスが 4 つしかないという保証はありません。異なるポイントで 50 個のボックスをすべてオーバーラップさせることができるので、おそらく JavaScript によるアルゴリズムが必要になるでしょう。
また、なぜ position: absolute なのかという質問に答えるために、ここに私のアジェンダのスクリーンショットを示します。
後ろのグリッドに気づきましたか？それはテーブルです。各要素は行内に配置され、複数の行にまたがってストレッチされます。絶対位置がない場合、その行が自動的に拡張され、グリッドが歪んでしまいます。
