zurb-foundation - Zurb Foundation を使用して要素をフォームに表示する

Question

私はCSS Framework Foundationを使用しており、次のコードを記述する場合:

<div class="row">    
   <div class="two mobile-one columns"><label for="invoiceterm-summary" class="right inline">Become late <span class="required">*</span></label></div>
   <div class="ten mobile-three columns"><input class="one" id="invoiceterm-late" name="invoiceterm[late]" type="text" value=""> days after invoice sent</div>
</div>
​

私はこれを得る：

しかし、次のように「請求書が送信されてからの日数」というテキストを表示したい:

Answer 1

foundation.css ファイルの input[type="text"] の css 定義から display: block プロパティを削除する必要がありました。

Answer 2

これらすべての要素を 1 つの要素に配置する必要があります。

<div class="row">
    <div class="twelve mobile-four columns"></div>
</div>

それ以外の場合は、正しく動作しており、画面サイズが縮小されるにつれて列が積み重ねられます。