2

960.gs グリッド システムを使用して HTML ページを作成しています。ガターの 1 つの中心に縦の点線を引きたいと思います。

グリッド オーバーレイのあるページ (赤でマークされたガター):

モックアップされた縦の点線のあるページ:

ただし、ガターは grid.css スタイルシートのマージンとして適用されます。コンテンツ列に境界線を追加すると、すぐにグリッドが外れてページが壊れます (最後の列 DIV が次の行に折り返されます)。

私の回避策は、ドットを含む 940px x 2px の縦に繰り返される背景をページ全体に与えることでした。

ただし、これはコードで処理することをお勧めします。

私の質問: に似たタイプの動作はありtext-indentますか?

マイナス値とともに使用すると、DIV のサイズ、マージン、パディング、または隣接する DIV に影響を与えることなく、テキストの開始を引き戻します。

おそらく、列の境界線で同様のことができるでしょう。

4

2 に答える 2

1

質問のように、私の回避策と最終的な解決策は、ドットを含む 940px x 2px の垂直に繰り返される背景をページ全体に与えて、点線の境界線のような錯覚を与えることでした。

私が理解している限り、これは私が見つけた最も望ましい効果的な解決策です。

于 2012-05-04T16:36:20.640 に答える
0

を追加する必要がありdivます。を追加する場合も同様ですpadding。

<div class="container_12">
    <div class="grid_6">
        <div id="content">
            <!-- Your content -->
        </div>
    </div>
</div>

#content { 
    border-right: 1px dotted black;
    padding: 0 1em;
}
于 2012-02-09T00:23:33.933 に答える