我试图使列表中列表项的最小高度等于100 px,以便为2行提供更多空间
.x-list .x-list-item
{
min-height: 500px; /*exaggeration just to see if it works
background-color: red;
}
背景红色显示,但是最小高度不会受到影响,显然是因为我检查了某个地方的重要css值" Inspect Element"在chrome
<div class="x-list-item-first x-list-header-wrap x-list-item-last x-list-footer-wrap x-list-item x-stretched x-list-item-tpl x-list-item-relative" id="ext-simplelistitem-1" style="min-height: 42px !important;"><div class="x-unsized x-list-disclosure" id="ext-component-6"></div><div class="x-innerhtml" id="ext-element-81"><div class="list-item-title">Title = Unsaved feed title</div> <div class="list-item-narrative">Unsaved feed narrative</div> </div></div>
不确定style="min-height: 42px !important
位是如何出现的,因为它不是来自css文件 - 彻底检查了文件夹
答案 0 :(得分:1)
你可以试试这个:
{
xtype: 'list',
itemTpl: '{title}',
itemHeight: 100,
data: [
{title: 'Item 1'},
{title: 'This is just a sample piece of code. Try this. It is fitting well.'},
{title: 'Item 3'},
{title: 'Item 4'}
]
}
您只需设置itemHeight
,这允许您设置默认项目高度,并用于粗略计算填充列表所需的项目数量。默认情况下,项目高约50px。
默认为:42。而已。快乐的编码。 :)
答案 1 :(得分:0)
将min-height
设置为列表模板中的父div:
itemTpl: new Ext.XTemplate(
'<div style="min-height:100px;">',
// ... your elements
'</div>')