换行保证金看起来不错 [英] newline margin doesnt look good

问题描述

我有一个href，后面是一个句子。但根据它可以在与句子相同的位置或换行的单词。但由于剩余空间：5px;它在换行时看起来不太好。我怎么能这样做，如果在左边没有任何其他的话，它会从一开始就开始。 http://jsfiddle.net/tVC43/11/

 < div class =boxstyle =border：1px solid red;> 
欢迎使用xxxxxxxxx部分。 
< nobr style =margin-left：5px> hi thomas< / nobr> 
< / div> 
< div class =boxstyle =left：200px; border：1px solid red;> 
欢迎使用xxxxxxxxx。 
< nobr style =margin-left：5px> hi thomas< / nobr> 
< / div> 
  

解决方案

Jsfiddle示例已更新。如下所示，在 nobr 中添加一些css规则。

 < div class =boxstyle =border：1px solid red;> 
欢迎使用xxxxxxxxx部分。 
< nobr> hi thomas< / nobr> 
< / div> 
< div class =boxstyle =left：200px; border：1px solid red;> 
欢迎使用xxxxxxxxx。 
< nobr> hi thomas< / nobr> 
< / div> 
  

CSS：

  .box {
 width：155px; 
 height：100px; 
 border：1px solid; 
位置：绝对; 
} 
 
 nobr {
 clear：left; 
 display：block; 
 
  

float：left &安培; display：block;

请让我知道。

< hr>

解决方案2： - 简单地从第二个 style =margin-left：5px > nobr

I have a href, which comes after a sentence. but according to the words it can in the same line with the sentence or in a new line. but because of the margin-left:5px; it doesn't look good when it is in a newline. how can i make it that if there isn't any other words in the left it would start from the very beginning. http://jsfiddle.net/tVC43/11/

<div class="box" style="border:1px solid red;">
   welcome to xxxxxxxxx part.
  <nobr style="margin-left:5px">hi thomas</nobr>
  </div>
  <div class="box" style="left:200px; border:1px solid red;">
   welcome to xxxxxxxxx.
  <nobr style="margin-left:5px">hi thomas</nobr>
  </div>

解决方案

Jsfiddle example updated. Add some css rules over the nobr as shown below.

<div class="box" style="border:1px solid red;">
   welcome to xxxxxxxxx part.
  <nobr>hi thomas</nobr>
</div>
<div class="box" style="left:200px; border:1px solid red;">
   welcome to xxxxxxxxx.
  <nobr>hi thomas</nobr>
</div>

CSS:

.box{
  width:155px;
  height:100px;
  border:1px solid; 
  position:absolute;
}

nobr {
    clear: left;
    display: block;
}

float: left & display: block;

Please let me know.

---

Solution #2: - simply remove style="margin-left:5px" from the second nobr

这篇关于换行保证金看起来不错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！