css-multicolumn-layout

1熱

1答えて

CSSカラムを使用して幅と高さが異なる画像を表示し、大きな空白なしで一緒に流れるようにしています。デスクトップブラウザでは完全に機能しますが、iPadとiPhone（iOS Chromeを使用）では、リストの最後の画像が列の外側になり、列のあるコンテナの右側に表示されます。私はプロパティのトラブルシューティングを行っており、iOSを従うことはできません。例のページ：https://gohbav

0熱

1答えて

マルチカラムCSSが正しく分割されない

私はCSSマルチカラムを持っています：Firefoxでは（<ul>のコンテンツは '壊れていません'）、クロムにはありません（最初のカラムにある項目は2番目に分割されます）。私はthis solutionを見つけましたが、どこにでもコードを配置することはできません。 .margin-bottom-0 { margin-bottom: 0; } .double > ul { co

0熱

1答えて

CSSの複数列レイアウトは、高さが変更されたときに列が移動しないようにします。

列の高さを変更したときに列が移動しないようにする方法を考えようとしています。ルックJSFiddle、見に3列のリンクをクリックしてください：https://jsfiddle.net/g305643f/1/ あなたは非マルチ列を持つソリューションを提供したい場合は - 列を構築するこのタスクは、以下の条件の下で、他の方法を用いて実現することができる。をデスクトップで我々はこれを必要とする：タブ

0熱

2答えて

新しい要素を追加するときに列カウント列の並べ替えを維持するにはどうすればよいですか？

「もっと読み込み」機能を備えたページがあります。私はcolumn-count CSSプロパティを使用して2つの列に分割します。これ以上クリックすると、最初の4つのdivがソートされ、すべてが最初の列に表示されます。私は同じ場所に滞在してのみ、残りを追加する最初の4つのdivを必要があります以下の図面やhttps://elodywedding.com/reviews1 を確認してください。ほとん

1熱

1答えて

break-inside：縁のパディングを使用しないでください。

パディングを含むブロック要素で列レイアウトを正しく動作させるには問題があります。私が直面している問題は、最初の列の白い背景の細い線が2番目の列の先頭に壊れることです。 IE11とMS-Edgeで発生します。 ChromeとFirefoxは意図したとおりに列を表示します。 .outer { -moz-column-count: 2; -webkit-column-coun

0熱

2答えて

石積み効果 - ブロックの順序を変更するにはどうしたらいいですか？

Iが位置された順で、（エフェクト石工用）columnsを使用 - トップダウン 1 3 5 2 4 6 * { box-sizing: border-box; } .columns { columns: 3; } .columns-item { background: #ccc; width: 100

0熱

2答えて

印刷複数の列

上に薄いHTMLテーブルIは、行をたくさん持っている、単純な2列のテーブルを持っている： <table> <tr><td>row 1 column1</td><td>row 1 column2</td></tr> <tr><td>row 2 column1</td><td>row 2 column2</td></tr> [500 more rows] <tr><td>row 4999 co

1熱

2答えて

複数列のレイアウト上にツールチップを配置する

単純なCSS 3列レイアウトに絶対配置されたツールチップを追加しようとしていますが、ツールチップは常に後続の列によって切り捨てられます。ツールチップは、ラッパー要素の上限または下限を上回ったり下回ったりすると、列間でブレークします。ツールチップが常に列の上にあることを確認する方法はありますか？また、列をまたいで折り返さず、ラッパー要素の境界の外で実行できるようにする方法はありますか？編集 -

1熱

1答えて

コンテンツを複数列のレイアウトに重ねることを許可する

複数列のレイアウトプロパティで設定した境界を無視して、複数の列を重ねるようにコンテンツを許可しようとしています。オーバーフローがhiddenに設定されているかのように - 問題にかかわらずposition、overflow又はz-indexの、列は前の列からのコンテンツが重複することを可能にすることはありませんとコンテンツを遮断することです。この動作を無効にすることはできますか？スニペット内の要

1熱

1答えて

クロムとサファリは、項目数が列数と等しい場合、CSSの列を別々に表示します。

CSS列を使用するディレクトリリスティングがありますが、ChromeとSafariでは動作が異なります。ディレクトリの各セクションには、リストを2つの列に並べ替えるラッパーがあります。 Chromeは私が望むようにそれをレンダリングするよう私はCSSを持っている：はサファリでは、2列目の最初の項目は、時にはそれ以上の見かけ上の余裕を持っています。私は、リスト要素にdisplay: inlin