如何防止DIV标签开始新的一行？

89

我想向包含标签的浏览器输出一行文本。呈现此效果时，DIV似乎会换行。如何在同一行的div标签中包含内容-这是我的代码。

<?php 
  echo("<a href=\"pagea.php?id=$id\">Page A</a>") 
?>
<div id="contentInfo_new">
  <script type="text/javascript" src="getData.php?id=<?php echo($id); ?>"></script>
</div>

我试图在这里整理一下。如何在一行上显示此内容？

html css

— 未定义
source

只是指出，使用echo时不需要括号。echo $id;与一样有效echo($id);。

— 艾迪·哈特

142

该div标签是块元素，造成这种行为。

您应该改用span内联元素。

如果您确实要使用div，请添加style="display: inline"。（您也可以将其放入CSS规则中）

— ak
source

13

仅display: inline与DIV的用途相矛盾，请不要这样做！请改用跨度。

— 罗伯特·K

28

我很清楚这一点；这就是我写信的原因if you really want to。

— SLaks

22

div定义为HTML5之前的页面划分。它没有定义任何呈现特征。换句话说，div基于其包含的内容和元素的定义在语义上是适当的。因此，最好将div设置为display：inline且不违反任何语义或标准定义。

2

就我而言，我不能使用span，因为我想定义一个断词自动换行属性，而这些属性仅适用于块类型元素。但是我不能使用div，因为我不想换行。所以我改用display: inline-block了div元素。说出您对样式的看法，但这解决了两个问题。

— jsarma 2013年

它对我没有用！我希望它可以扩展div所在的单元格，但没有发生任何变化

— rezKesh 2014年

36

我不是专家，但尝试 white-space:nowrap;

所有主要浏览器均支持空白属性。

注意："inherit"IE7和更早版本不支持该值。IE8需要一个!DOCTYPE。IE9支持"inherit"。

— Shivanshu
source

当您需要将内嵌块元素overflow: hidden放在包装元素上并根据父级“在背景上”将其移动到行的末尾时，这种方法

— 非常有用

16

div 是一个块元素，总是占据自己的一行。

使用span标签代替

— 钴
source

10

您对功能的演示感到困惑。div占据了自己的一行，因为默认情况下它以display：block表示，而没有其他原因。

1

但是span还会在前后产生换行符吗？

— user3761308 '17

6

添加style="display: inline"到您的div中。

— 弗朗兹
source

5

在div和链接上使用float：left，或使用跨度。

— 吉姆
source

1

使用CSS属性-空白：nowrap;

— Jithjob恶心
source

0

更好的方法是使用带有CSS样式参数white-space的span：nowrap;

span.nobreak {
  white-space: nowrap;
}

or
span.nobreak {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

直接在HTML中显示示例

<span style='overflow:hidden; white-space: nowrap;'> YOUR EXTENSIVE TEXT THAT YOU CAN´T BREAK LINE ....</span>

— 亚历克斯曼弗林
source

-1

<div style="float: left;">
<?php 
  echo("<a href=\"pagea.php?id=$id\">Page A</a>") 
?>
</div>
<div id="contentInfo_new" style="float: left;">
  <script type="text/javascript" src="getData.php?id=<?php echo($id); ?>"></script>
</div>

— 德菲尔科维
source

3

使用javascript + php的想法很糟糕，如果您只用css就可以了。

— ZurabWeb 2014年

@Piero为什么这么说？前端应用通常需要后端

— Curious

3

@Curious是的，但后端应处理诸如计算和数据处理之类的后端事务，而前端应留给浏览器处理。这样可以减少服务器负载并改善用户体验。一般而言。但是，在这种情况下，<a href="pagea.php?id=<?php echo $id; ?>“>页面A </a>就足够了。并使用getData.php，如果可以由apache处理，为什么还要进行php解析并输出javascript？像这样：src =“ getData.js？id = <？php echo $ id;？>”

— ZurabWeb

-2

您可以简单地使用：

#contentInfo_new br {display:none;}

— 用户名
source