複数の入力が1行になるようにフォームのスタイルを設定するにはどうすればよいですか？

Question

私は次のコードを持っている：

<?php 
    echo $form->create('User', array('url' => array('controller' => 'users', 'action' =>'login'))); 
echo $form->input('User.username'); 
echo $form->input('User.password'); 
echo $form->end('Login'); 
?> 

をし、それは次のようになり、フォーム作成：

username 
[TextBox] 
password 
[TextBox] 

を、私はそれが次のようになりたい：

username [TextBox] password [TextBox] 

です私はこれを行うために使用できるオプションか何かを持っていますか？

Answer 1

私は私はこのようなテーブルを使用して終了CSS-スタイルで苦戦した後：

<?php 
echo $this->Form->create('User', array('url' => array('controller' => 'users', 'action' =>'login'))); ?> 
<table> 
    <tr> 
     <td><?php echo $this->Form->input('User.username'); ?></td> 
     <td><?php echo $this->Form->input('User.password'); ?></td> 
     <td><?php echo $this->Form->button('Submit Form', array('type'=>'submit')); ?></td> 
    </tr> 
</table> 
<?php echo $this->Form->end(); //This and "create" has to be outside <table> to pass xhtml validation ?> 

Answer 2

1つのdiv内のすべてのフィールドを包みます。適切な右余白を設定して、すべてを左に浮かべてください。 divをクリアします。

Answer 3

要素を隣り合わせに浮動させるか、インラインで表示します。私は通常、浮動小数点数が絶対に必要なときにのみ使用します - インライン要素はとにかく簡単に動作します。

<form method="post" action=""> 
<fieldset> 
    <dl> 
     <dt><label for="username">Username:</label></dt><dd><input type="text" name="username" value="Username" id="username" /></dd> 
     <dt><label for="password">Password:</label></dt><dd><input type="password" name="password" id="password" /></dd> 
    </dl> 
</fieldset> 
</form> 

は基本的にあなたが追加する必要があるすべてはあなたのリストの要素のいずれかinline-blockかinline次のとおりです。

dt { display: inline; } 
dd { display: inline; } 

プレビュー：http://jsfiddle.net/Wexcode/Wav9B/