1

こんにちは、私はギャラリー スタイルのサイトを構築しており、cssgrid.net の 1140 ピクセルのグリッドを使用することに非常に興味があります。このプロジェクトには 960 ピクセルでは小さすぎると感じているためです。

最初の行にそれぞれ 4 列の 3 つの画像を配置し、その下の残りの行にそれぞれ 3 列の 4 つの画像を配置したいと考えています。

問題は、これを行うと、2 つの行の右端が揃わなくなり、明らかにギャラリーの見栄えがよくないことです。これは、このグリッドのパーセンテージで構築された列による四捨五入が原因であることを理解しています。しかし、それでも見栄えが悪いので、何らかの方法でそれらを整列させたいと思っています。これに対する解決策は何ですか？

ここのインデックスページの私のコード: http://pastebin.com/c76U7J5g

これを確認するには、cssgrid.net グリッドをダウンロードする必要があります。

ここに画像の説明を入力

4

2 に答える 2

2

パーセンテージ ベースのレイアウトはピクセル パーフェクトではありません。プロジェクトの 1 つでCSS フレームワークhttp://www.1140px.com/を使用しましたが、満足しています。ピクセルパーフェクトなレイアウトが必要な場合は、試してみてください。

于 2012-09-12T19:32:34.380 に答える
1

何が起こっているのか理解できれば、それは単純な間違いのように見えます。

プレースホルダー画像 (猫) が小さすぎます。このグリッド システムでプレースホルダー イメージを使用するのは、プレースホルダーのサイズを宣言する必要があるため、注意が必要です。実際には、ライブページでは、グリッドシステムが壊れるため、画像に寸法が指定されていません (グリッドは、画像を配置した列に収まる最大サイズに縮小するだけです)。

簡単に言うと、プレースホルダーの画像が小さすぎます。フルサイズでは、グリッドスポットを埋めないため、説明した奇妙な配置が発生します. そうは言っても、適切に縮小できるように、常に少なくとも 1000px のプレースホルダーを配置します。

編集：

Foundation が行うことを試してください:

.last {
float: right;
}

それをスタイルシートに追加します-最後の列の右端に揃える必要があります。

于 2012-06-29T16:42:43.440 に答える