文本和標籤出現在同一行

我很難過，因爲我已經嘗試了CSS和直接的HTML通過表的方式讓我的文本和文本框出現在同一行上，但是無論哪種方法總是使用文本框頂部的文本。我喜歡table方法，因爲我的CSS方法只是將頁面拆分爲一半，並且在文本框之間存在一個尷尬的空間。文本和標籤出現在同一行

然而，問題是 - HTML中的方式是什麼（我們可以使用JavaScript，JQuery，CSS，HTML等）來相應地設置它的格式？

嘗試1

<table> 
<tr> 
    <td>Payroll End Date:<input type="date" name="enddate" value="<?= $_POST['psdate'] ?>"></td> 
    <td>Payroll End Date:<input type="date" name="startdate" value="<?= $_POST['pedate'] ?>"></td> 
</tr> 
</table>

嘗試2

<div id="right">Payroll End Date:<input type="date" name="enddate" value="<?= $_POST['psdate'] ?>"></div> 
<div id="left">Payroll End Date:<input type="date" name="startdate" value="<?= $_POST['pedate'] ?>"></div> 


#left { 
    float: right ; 
    width: 50% ; 
} 
#right { 
    float: right; 
    width: 50%; 
}

來源

2017-07-30 IcyPopTarts

你必須做的'input'一個'顯示：inline-block的;'在CSS –

你的表和DIV似乎罰款。 ..你的身體設置有什麼問題？還記得表格對於響應性並不是很好。 – Samuel

@Samuel - 例如，看到這個小提琴 - 文本出現在日期選擇器上方。我希望文本顯示在它的左側http://fiddlesalad.com/html/ – IcyPopTarts

試試這個例子 - 它爲我工作，提出在同一行的一切

<div name="payroll" id="oneline"> 
Payroll End Date:<input type="date" name="enddate" value="<?= $_POST['psdate'] ?>"> 
Payroll End Date:<input type="date" name="startdate" value="<?= $_POST['pedate'] ?>"> 
</div>

，並添加一些CSS味道

#oneline { 
    display: inline-block; 
    vertical-align: right; 
}

在這裏，一個方便的小提琴 http://jsfiddle.net/Lera/HEeHd/

來源

2017-07-30 23:06:15 BellHopByDayAmetuerCoderByNigh

文本和標籤出現在同一行

回答

相關問題