css - iOS sencha touch 中的列表元素填充

Question

我在 iPhone 中显示列表元素时遇到问题，图像中的“黑色”与 itemdisclosure 图标重叠。我尝试使用 text-align: "right" 对其进行样式设置，但没有发现任何区别。任何帮助，将不胜感激

这是我的列表代码

itemTpl : [
    '<p style="font-family:arial;color:black;font-size:20px;">{DESCRIPTION}</p>',
    '<div style="font-size: 0.75em; color: darkgray">SKU:{CODE}</div>'
].join(''),

Answer 1

您应该不会遇到这个问题，因为 sencha 会根据文本调整 itemdisclosure 图标。

无论如何，只要给p标签宽度

CSS

.description{
 font-family:arial;
 color:black;
 font-size:20px; 
 width:90%; // reduce as you wish
}

.code {
 font-size: 0.75em; 
 color: darkgray;
}

列出代码

itemTpl : [
    '<p class="code ">{DESCRIPTION}</p>',
    '<div class="description">SKU:{CODE}</div>'
].join(''),

好吧，你仍然想要内联样式

 itemTpl : [
    '<p style="font-family:arial;color:black;font-size:20px; width:90%;">{DESCRIPTION}</p>',
    '<div style="font-size: 0.75em; color: darkgray">SKU:{CODE}</div>'
 ].join(''),