0

D7 で構築されたサイトを 7.x-56 zen サブテーマで更新しています。テーマは、レスポンシブな水平に積み重ねられたコンテンツ領域でレイアウトされています。カスタム ブログ コンテンツ タイプと、分類法、アーカイブ、および最近の投稿に基づく 3 つのビュー ブロックを作成しましたが、コンテンツ領域内の個々のブロックのレイアウトに問題があります。

私が欲しいのは、3 つのブログ コンテンツ フィルター ブロックが積み重なって右に浮いているのに対して、ブログ自体は左に浮いているということです。私は多かれ少なかれこれをやってのけましたが、ブロックを浮かせてクリアし、お互いの上に積み上げましたが、私が抱えている問題は、それらが最初のブログ投稿の高さに何らかの影響を与えていることです. ここに画像の説明を入力 では、フローティング要素がビュー行の高さに影響を与えるのはなぜですか?どうすればこれを修正できますか? ここにサイトのライブ バージョンを表示できます。ここにリンクの説明を入力してください。コンテキストの場合、ページはカスタム コンテンツ タイプから構築されたビューであり、フィルター ビューはコンテキスト モジュールを使用して配置され、行の高さは -9 と同じです。ここにサイドバー領域を追加する必要がありますか? またはこれに対するcss修正はありますか？

4

1 に答える 1

1

メインのブログ エリアに幅 % を指定し、左にフロートさせます。右側の積み重ねられた div については、それらすべてを 1 つの div に配置し、その div を右側にフロートさせてから、その div に幅 % を指定します。

次に、これらの div の両方を含む div を「overflow:auto」に設定してください。

#main {
  overflow:auto;
}

#left {
  float:left;
  width:65%;
}

#right {
  float:right;
  width:30%;
}



<div id="main">
    <div id="left"></div>
    <div id="right">
        <div id="box-1"></div>
        <div id="box-2"></div>
        <div id="box-3"></div>
    </div>
</div>
于 2016-11-21T18:25:21.447 に答える