Rails erb 样式 CSS答案

【问题标题】：Rails erb styling CSSRails erb 样式 CSS
【发布时间】：2017-02-20 02:08:46
【问题描述】：

我想知道是否有人可以帮助解决这个问题... 以下是用户个人资料页面上的简短列表的代码。我希望能够使用 h2 设置固定文本的样式，即“名称”、“电子邮件”和“用户类型”，而 ruby 则使用 h4 提供内容。我的问题是，当我使用第 6 行的代码并在标签之间嵌入 h4 内容时。文本跳出顺序并出现在另一行。组织这个的正确方法是什么，以便我可以使用不同的标签设置 ruby 样式并保持文本一致。

非常感谢

1<div class="profile-content">
2   <ul>
3       <li><h2>Name: <%= @user.name %></h2></li>
4       <li><h2>Email: <%= @user.email %></h2></li>
5       <% if @user.admin %>
6       <li><h2>User Type: <h4>Admin</h4> </h2></li>
7       <% else %>
8       <li><h2>User Type: Standard</h2></li>
9       <% end %>
10  </ul>
11</div>

【问题讨论】：

查看我的回答，但是如果目标是让 h2 和 h4 类显示为内联，那么您可能应该只创建一个 span 类，因为 h2 和 h4 并非设计为内联样式，它令人困惑/非常规。
感谢您抽出宝贵时间回复@TimmyVonHeiss 我对css html内容不太聪明，考虑到列表，上面的span类会是什么样子，或者我会放弃列表标签完全？谢谢

标签： css ruby-on-rails erb styling

【解决方案1】：

<li><h2>User Type:</h2> <h4>Admin</h4> </li>

h2, h4 { display: inline-block }

你也可以用作行间的分隔符：

What is a clearfix?

【讨论】：

我希望这么简单的东西能奏效……但恐怕不行。
你能重现这个问题吗jsfiddle.net/xdn1da81
我明白了，你是对的。我尝试添加我的列表样式以查看是否会破坏它，但它仍然适用于小提琴。只是对我不起作用。一定是其他一些冲突的样式。感谢您清理它，我将不得不取消选择我的其他样式以查看问题所在......我会将其标记为正确。再次感谢

【解决方案2】：

你应该在开始你的 h4 标签之前关闭你的 h2 标签。

<li><h2>User Type: </h2><h4>Admin</h4> </li>

【讨论】：