如何避免標籤內部出現文字錯誤？

-1

我的風格標籤與CSS屬性但問題是每一個字是打破到label.For例如"Withdraw money"內新線呈現這樣如何避免標籤內部出現文字錯誤？

Withdraw 
money

我嘗試了所有的財產一樣white-space:nowrap,float: left,display:inline-block,display:inline,，但沒有什麼工作！一個還有一點，任何人可以解釋爲什麼顏色屬性不是爲內部標籤的文本工作我的代碼如下：？

body, 
 
h1, 
 
h2, 
 
h3, 
 
p, 
 
td, 
 
quote, 
 
small, 
 
form, 
 
input, 
 
ul, 
 
li, 
 
ol, 
 
label { 
 
    margin: 0px; 
 
    padding: 0px; 
 
} 
 
body { 
 
    margin-top: 20px; 
 
    font-family: Arial, Helvetica, sans-serif; 
 
    color: #51555C; 
 
    height: 100%; 
 
    font-size: 11px; 
 
} 
 
/* Form styles */ 
 

 
input, 
 
select { 
 
    padding: 3px; 
 
    color: #333333; 
 
    border: 1px solid #96A6C5; 
 
    margin-top: 2px; 
 
    width: 200px; 
 
    font-size: 14px; 
 
} 
 
select { 
 
    width: auto; 
 
    padding: 2px; 
 
} 
 
.formline { 
 
    padding: 3px; 
 
} 
 
label { 
 
    font-size: 14px; 
 
    display: block; 
 
    text-align: left; 
 
    white-space: nowrap; 
 
    color: #203360; 
 
} 
 
table { 
 
    width: 400px; 
 
} 
 
td { 
 
    font-size: 11px; 
 
} 
 
.input-container { 
 
    padding: 8px; 
 
} 
 
#div-regForm, 
 
.registered { 
 
    border: 3px solid #eeeeee; 
 
    padding: 15px; 
 
    background: url(images/bg.jpg) repeat-x #999933; 
 
    color: #203360; 
 
    margin: 15px auto 40px auto; 
 
    width: 400px; 
 
} 
 
.form-title, 
 
.form-sub-title { 
 
    font-size: 40px; 
 
    font-family: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif; 
 
    font-size: 20px; 
 
    font-weight: bold; 
 
} 
 
.form-sub-title { 
 
    font-weight: normal; 
 
    padding: 6px 0 15px 0; 
 
}

<div id="div-regForm"> 
 
    <div class="form-title">Withdraw money</div> 
 
    <table> 
 
    <tbody> 
 
     <tr> 
 
     <td> 
 
      <label for="fname" style="color: #990000">Withdraw address</label> 
 
     </td> 
 
     <td> 
 
      <div class="input-container"> 
 
      <input name="email" id="email" type="text" /> 
 
      </div> 
 
     </td> 
 
     </tr> 
 

 

 
     <tr> 
 
     <td> 
 
      <label for="fname" style="color: #990000">Amount</label> 
 
     </td> 
 
     <td> 
 
      <div class="input-container"> 
 
      <input name="amount" id="amount" type="text" /> 
 
      </div> 
 
     </td> 
 
     </tr> 
 
    </tbody> 
 

 
    </table> 
 

 
</div>

來源

2014-12-07 user2252617

嘗試'white-space：nowrap;'在css中 – Lal 2014-12-07 16:14:53

即在您的CSS中添加'white-space：nowrap;'至'label' – Lal 2014-12-07 16:15:30

@Lal，OP特別聲明已經嘗試過了，他已經在他的代碼中顯示了這一點。 – Sparky 2014-12-07 16:15:36

這似乎是'撤回錢'是在一個div。嘗試應用分詞：keep-all;到div。看起來div也缺少空白：nowrap;

同時檢查你的divs和標籤的最大寬度及其父母的寬度。你也可以嘗試在這裏申請分詞。

我不能評論，我不確定這是否會有所幫助，我正在學習網絡開發，我不得不擺弄我的網站，這些都是幫助我的東西:)

來源

2014-12-07 16:23:57 Burbanana

-1

<!DOCTYPE html> 
<html> 
<head lang="en"> 
    <meta charset="UTF-8"> 
    <title></title> 
    <style> 
     /* Page styles */ 

     body,h1,h2,h3,p,td,quote,small,form,input,ul,li,ol,label{ 
      margin:0px; 
      padding:0px; 
     } 

     body{ 
      margin-top:20px; 
      font-family:Arial, Helvetica, sans-serif; 
      color:#51555C; 
      height:100%; 

      font-size:11px; 
     } 


     /* Form styles */ 

     input,select{ 
      padding:3px; 
      color:#333333; 

      border:1px solid #96A6C5; 
      margin-top:2px; 
      width:200px; 
      font-size:14px; 
     } 

     select{ 
      width:auto; 
      padding:2px; 
     } 

     .formline{ 
      padding:3px; 
     } 

     label{ 
      font-size:14px; 

      display:block; 
      text-align:left; 
      white-space:nowrap; 
      color:#203360; 
     } 

     table{ 
      width:400px; 
     } 

     td{ 
      font-size:11px; 

     } 

     .input-container{ 
      padding:8px; 

     } 


     #div-regForm,.registered{ 
      border:3px solid #eeeeee; 
      padding:15px; 

      background:url(images/bg.jpg) repeat-x #999933; 
      color:#203360; 
      margin:15px auto 40px auto; 
      width:400px; 
     } 

     .form-title, 
     .form-sub-title{ 
      font-size:40px; 

      font-family:"Lucida Grande",Tahoma,Verdana,Arial,sans-serif; 
      font-size:20px; 
      font-weight:bold; 
     } 

     .form-sub-title{ 
      font-weight:normal; 
      padding:6px 0 15px 0; 


     } 
    </style> 
</head> 
<body> 
<div id="div-regForm"> 
    <div class="form-title">Withdraw money</div> 
    <table> 
     <tbody> 
     <tr> 
      <td><label for="fname" style="color: #990000">Withdraw address </label></td> 
      <td><div class="input-container"><input name="email" id="email" type="text" /></div></td> 
     </tr> 

     <tr> 
      <td><label for="fname" style="color: #990000">Amount</label></td> 
      <td><div class="input-container"><input name="amount" id="amount" type="text" /></div></td> 
     </tr> 
     </tbody> 

    </table> 

</div> 
</body> 
</html>

我剛剛複製並粘貼了您的代碼。它很簡單。（測試IE11，Chrome和Firefox）只需檢查您的瀏覽器版本

來源

2014-12-07 16:31:37 SanPanthera

如何避免標籤內部出現文字錯誤？

回答

相關問題