JavaScriptとHTMLによる改行

Question

JavascriptとHTMLに問題があります。 ユーザーが送信するフォームを使用しています。資格情報が間違っていると、スクリプトは入力フィールドの横にテキストメッセージを表示します。
メッセージにはクリック可能なメールが含まれています。
これは次のとおりです。
メッセージが文字列のみの場合、すべてがOKです。
<a href=\"mailtoタグを追加すると、改行が行われます。

<div id="message_box"> 
<span id="msgbox" style="display:none"></span> 
</div> 

OK：

$("#msgbox").fadeTo(200,0.1,function() 
     { 
      var msg = ("Ooops, the number you enterd is not valid<br /> Please contact: some@mail.com to solve this problem").replace(/[\r\n]/g, ''); 
      $(this).html(msg).addClass('messageboxerror').fadeTo(900,1); 
     }); 

（EDIT）が表示さ：
をメールで送信、あなたがenterd番号が有効ではありません
連絡してください：some@mail.comこの問題

を解決するために

NOT OK：

$("#msgbox").fadeTo(200,0.1,function() 
     { 
      var msg = ("Ooops, the number you enterd is not valid<br /> Please contact: <a href=\"mailto:some@mail.com\">some@mail.com</a> to solve this problem").replace(/[\r\n]/g, ''); 
      $(this).html(msg).addClass('messageboxerror').fadeTo(900,1); 
     }); 

は（EDIT）表示：
メールで送信、あなたがenterd数は、有効な
ではありません連絡してください：
some@mail.com
を

にCSS、この問題を解決するために：

を

#message_box { 
    width:370px; 
    height:30px; 
    padding-top:15px; 
} 



    .messagebox{ 
position:relative; 
width:100px; 
margin-left:0px; 
padding:290px; 
font-size:14px; 
color: #647a03; 
} 
.messageboxok{ 
position:relative; 
padding:0px; 
width:100px; 
color:#F00; 
font-size:10px; 

} 
.messageboxerror{ 
position:relative; 
width:100px; 
padding:0px; 
color:#CC0000; 
font-size:12px; 
} 

誰も私がこれらの迷惑な改行を取り除くのを助けることができますか？

ありがとうございます！

Answer 1

のコメント：いくつかのコメンターによって要求された完全なCSS code考える

、aタグがdisplay: blockに設定されています。このアンカータグにはinlineに設定する必要があります。

W3Cの資源：

• Controlling box generation
• The 'display' property

Answer 2

簡単な答えはmessageboxerrorクラスにCSS white-space:nowrap;を使用することです。

.messageboxerror { 
    white-space:nowrap; 
} 

あなたにもdisplay:inline-block;、および他のトリックで遊んことができますが、私にはNOWRAPの修正は、トリックを行う必要があります。

この文脈では、それは修正よりも回避策のほうが多いため、その原因となるレイアウトの問題を修正することはできませんが、問題を解決すればそれ以上は掘り下げる必要はありません。