表示テキストとテキストフィールド

Question

私たちは以下のように、テキストとテキストフィールドを表示するには、コードの下に使用されています

http://i.stack.imgur.com/dTL1K.png

<li class="inline-label"> 
<label for="summary_field" class="required"><em></em><?php echo $this->__('Review Title :') ?></label> 
<div class="input-box"> 

<input type="text" name="title" id="summary_field" class="input-text required-entry" value="<?php echo $this->escapeHtml($data->getTitle()) ?>" /> 
</div> 
<p>(Maximum 60 characters)</p> 
</li> 

しかし、私は以下のように単一行のテキスト&テキストフィールドの両方を表示したいです：

http://i.stack.imgur.com/fdAEO.png

Answer 1

.input-box { 
 
    width:100%; 
 
} 
 
.inline-label { 
 
    display: inline-block; 
 
    width:100%; 
 
} 
 
.required { 
 
    float: left; 
 
    padding-right: 15px; 
 
} 
 
p { 
 
    float:left; 
 
    margin-top:5px; 
 
} 
 
.input-box { 
 
    width: 70%; 
 
    float: left; 
 
} 
 
.input-text { 
 
    width:100%; 
 
    
 
}

<li class="inline-label"> 
 
    <label for="summary_field" class="required"> 
 
    <em>Review Title</em> 
 
    </label> 
 
    <div class="input-box"> 
 
     <input type="text" name="title" id="summary_field" class="input-text required-entry" value=""> 
 
    <p style=" 
 
    float: left; 
 
">(Maximum 60 characters)</p> 
 
    </div> 
 
    
 
</li>

Answer 2

使用この

.inline-label>.input-box 
{ 
    display:inline-block; 
} 

これは、CSSによって行うことができる

Working example