在CSS的Ruby on Rails视图中实现这样的最佳方法是什么:
这就是我现在所拥有的:
清单项目1-不太长
列出项目2-非常长,我不希望“列”这么大;我要把它包起来
清单项目3-你好
这就是我要的:
列表项来自解决方案类;赞成/反对是来自Solution_votes类的投票。
理想情况下,我将使用具有3列的表,但是,我也使用Axaj和JQuery进行更新,并希望使用无序列表(以使用$('#items_list')。prepend(new_item);轻松进行更新)。
最佳答案
HTML:
<ul class="entries">
<li>
<span class="title">List Item 1 - is not too long</span>
<a class="thumb down">0 Votes Down</a>
<a class="thumb up">0 Votes Up</a><!-- float:right will place this to the left -->
</li>
...
</ul>
CSS:
ul.entries { list-style: none; }
ul.entries li {
margin: 10px 0;
border: 2px solid black;
border-radius: 6px;
width: 600px;
}
ul.entries .title {
float: left;
width: 380px;
}
ul.entries .thumb {
float: right;
margin-left: 20px;
width: 90px;
/* todo: color, background + padding-left declarations for thumb icons */
}
关于css - CSS/Ruby on Rails-将列表分成三个独立的等宽列,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/11543015/