css-multicolumn-layout

0熱

1答えて

私は私のCSSはこのように見えるように取得しようとしています：しかし、これまでのところ私はそれがこの（まだフォント情報や画像に付加する）ように見えるように取得することができます。イメージ1のように見えるようにするにはどうすればよいですか？複数の列を使用しようとしていますが、機能していません。 article { font-family: "alternate-gothic-no-

2熱

2答えて

カラムスパンなしでFirefoxで列レイアウトを分割する方法は？

FirefoxがCSSプロパティ 'column-span'をまだサポートしていないことが判明しました。 'column-span'を指定しないと、列のレイアウトを分割することができないようです。同じ結果を得るための回避策はありますか？

1熱

1答えて

列あたり2つのリスト項目を持つ複数列プロパティ

私は、順序付けられていないリストをスタイルするためにCSS3複数列プロパティを使用します。 1列あたり2つのリスト項目で合計2行8列にしたいと考えています。しかし、実際には1つの列に3つのリスト項目があります。単語の長さが短い場合などです。最初の3つのリストアイテム "New In"、 "Sale"、および "Looks"は同じ列にあります。 <ul class="subnav-links">

0熱

1答えて

CSSで列数を使用してX列を設定できません

CSSで列を使用する際に問題があります。私はcolumn-count: 6;を設定したかったが、その結果は5列しかなかった。値< = 5の場合はうまく動作しているようですが、何かを高く設定しようとすると奇妙な結果が出ます。列数が一致しません。ここで .columns { column-count: 6; } .columns__item { display:

0熱

2答えて

複数の列にまたがるのではなく、特定のコンテンツを1つの列に限定するにはどうすればよいですか？

私はそれぞれのヘッダーと段落が、自動的にフォーマットされるのではなく、1列だけ離れていることを制限して、空きがなくなったときに次の列に移動しようとしています。 .columns { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } .div1 {

1熱

1答えて

列を使用するときにクロムがすべての幅を使用しないのはなぜですか？

Chromeと列に問題があります。複数の列に分割されない列に編成されたタイトル付きのリンクセットが必要です。私はこれをファイアフォックス、すなわちサファリで達成することができましたが、クロムはボールを弾いていません。表示の場合：インラインブロックが削除されている場合は、すべてが乱雑に見える場合を除きほとんど機能しません。助けを歓迎します。そのようにそれをしないのはなぜ footer {

0熱

1答えて

CSSで列内の分割カードを防止する

2つの列でタイムラインを作成しています。私が持っている問題は、下の画像に示すように、1枚のカードが2つの列に分割されていることです。どうすればこの問題を解決できますか？ここであなたは私のSCSSとHTMLコードを持っています。ありがとうございます。 .card-col-2 { @media (min-width: 980px) { column-count: 2;

2熱

1答えて

マルチコラムレイアウトで唯一のアイテムをセンターに置く方法

私は、ダイナミックイメージを2列レイアウトにしています。イメージが1つしかない場合は、どのようにイメージを中央に配置するか、またはカラムを1つにまとめるのですか？現在、単一の画像が左の列に配置されています。 CSSのみのソリューションはありますか？列内の最後の項目に同じロジックが適用されますか？ p{ column-count: 2; column-gap: 0; }

0熱

1答えて

page-break-inside：レベル要素を避けてブロックすると、Chromeの空の列が作成されます

このフィドルでは、https://jsfiddle.net/rpep00dg/7/のコンテンツはChromeの空の列の先頭に追加されます。 FirefoxやSafariでフィドルを開くと、「ヘッダー」の前に空の列がありません。これは、最初の要素がpタグのようなブロックレベルの要素である場合のようです。これはどこに文書化されているChromeのバグですか？また、FirefoxやSafariのように

-1熱

1答えて

CSSで100％高さの列を取得するには？

私は100％の高さの列をテキストで取得したいと思いますが、divの一番下が決して満たされないようです。 HTML： <div id="conteneur"> <div id="contenu"> <div id="article"> <p>Alii nullo quaerente vultus severitate adsimulata patrimonia sua in inmensum