Html SPAN 彼此相邻,无浮动

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5508033/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 07:43:33  来源:igfitidea点击:

SPAN next to each other WITHOUT float

csshtml

提问by Matt

How would you get three span's to sit side by side instead of going to the next line without using float in CSS? so I need all three of these to appear next to each other..or if there is another method without using float. THanks!

在 CSS 中不使用 float 的情况下,如何让三个 span 并排坐着而不是转到下一行?所以我需要所有这三个都出现在彼此旁边......或者如果有另一种不使用浮动的方法。谢谢!

<span style="display:block; width:33%;">Test1</span>
<span style="display:block; width:33%;">Test2</span>
<span style="display:block; width:33%;">Test2</span>

回答by clairesuzy

display: inline-block;or their natural (default) display of inline.. though you can give the inline-block a width and height

display: inline-block;或者它们的内联自然(默认)显示..虽然你可以给内联块一个宽度和高度

回答by drudge

Try display: inline-block;instead.

试试吧display: inline-block;

回答by Jordash

Yeah By Default Spans will show up next to each other, it all depends on the width of the element containing them. If someone were to re-size the browser or you shrunk the containing div their would be a line break.

是的,默认跨度将彼此相邻显示,这完全取决于包含它们的元素的宽度。如果有人要重新调整浏览器的大小,或者您缩小了包含的 div,则它们将是换行符。

回答by Silicon Dales

Use display: inline;and this will achieve what you want.

使用display: inline;,这将实现您想要的。