行を共有し ( Foundation の言葉の意味で)、行内で均等に分散する必要がある意味的に関連するテキスト フィールドの数が不明なフォームを動的に作成しています。blockgrid クラスの方が適しているように思えますが、修正前および修正後のクラスをその中で動作させることができません。
注: これは私の実際のコードではなく、コミュニティの有用性を高めるために問題を一般化したものです。
<ul class="large-block-grid-<? echo count($choices);?> row"> <!-- $choices = array of fields-->
<h6><span data-tooltip class="has-tip" title="">TooltipText</span></h6>
<li class="row collapse">
<div class="small-9 columns">
<label for="inputA">
<input type="text" id="inputA" name="inputA" placeholder="val" />
</label>
</div>
<div class="small-3 columns">
<span class="postfix radius">PostFix Label A</span>
</div>
</li>
<li class="row collapse">
<div class="small-9 columns">
<label for="inputB">
<input type="text" id="inputB" name="inputB" placeholder="val" />
</label>
</div>
<div class="small-3 columns">
<span class="postfix radius">PostFix Label B</span>
</div>
</li>
</ul>
対応するフィールドよりも背の高い接尾辞と、左マージン/パディングの問題が発生します (スクリーン キャップを参照)。誰?