當標簽中的文本大於此標簽的寬度時，如何在與輸入相同的行中顯示標簽？

Question

是否可以例如以33.33％的寬度顯示文本並輸入：66.34％。 當標簽中的文本長於寬度時，將其分成幾行，並在同一行上顯示第一個單詞（字母）作為輸入。 您可以在我的網站上的手機上嘗試。 現在，當文本較大時，標簽的寬度將顯示在同一行的輸入上方。 網站： site 。 謝謝。 PS：嘗試480px。

CSS：

#form input.ui-input-text, textarea.ui-input-text {
    display: inline-block !important;
    width: 66.64% !important;
}
#form [data-role='fieldcontain'] > label{
    display: inline-block !important;
    width: 33.33% !important;
}
textarea { vertical-align: middle; }​

HTML：

<div data-role="fieldcontain">
  <label for="f_FName">Name: *</label>
  <input id="f_FName" type="text" value=""  name="f_FName">
</div>
<div data-role="fieldcontain">
  <label for="f_CAdd">Adresa</label>
  <textarea id="f_CAdd" class="ui-input-text ui-body-d ui-corner-all ui-shadow-inset" cols="30" rows="2" name="f_CAdd" type="textarea"></textarea>
</div>

Answer 1

你有沒有嘗試過 ：

#form input.ui-input-text, textarea.ui-input-text {
    width: 66.64%;
}
#form [data-role='fieldcontain'] > label{
    display: inline-block;
    width: 33%;
    overflow:hidden;
    white-space:nowrap;/* keep text on one line */
}
textarea { vertical-align: middle; }​