css - 使用时如何避免开始新行ajax刷新加载？

Question

如果我像下面这样换行，它会自动转到下一行。
没有 ，按钮就在它旁边，这就是我想要的。
但我必须用于 ajax 重新加载目的。我该如何解决这个问题？

<div class="bookmark" data-communities-id="<%= community.id %>">
    <%= render :partial => "communities/bookmark", :locals => {:community => community} %>
</div>  

Answer 1

将 display:inline 用于书签类。

.bookmark{
    display:inline;
}

Answer 2

您将 div 用于您想要的内联内容，请改用 span。

<span class="bookmark" data-communities-id="<%= community.id %>">
    <%= render :partial => "communities/bookmark", :locals => {:community => community} %>
</span>  

Answer 3

div 是块级元素。这意味着它将像一个块，而不是像一个内联元素。

display将属性更改为

• inline如果要将其更改为内联级别元素；
• inline-block如果您希望它是内联的，但充当块元素级别。

演示：http: //jsfiddle.net/

CSS

div {
 border: 1px solid red; 
 padding: 10px; 
 background-color: #ccc;
 color: white;
 width: 100px;
}

HTML

Display: block (default):<br/><br/>
<div>Frindcode</div>
<div>Bookmark</div>

<br/><br/><br/>

Display: inline:<br/><br/>
<div style="display: inline;">Frindcode</div>
<div style="display: inline;">Bookmark</div>

<br/><br/><br/>

Display: inline-block:<br/><br/>
<div style="display: inline-block;">Frindcode</div>
<div style="display: inline-block;">Bookmark</div>