listview li-element/item을 어떻게 작게 만들 수 있습니까? 이미지 및 텍스트로 높이를 변경하는 방법은 무엇입니까?

Question

li 요소 (listview-item)의 높이를 더 작게 변경하고 verticalcenter에서 두 개의 텍스트를 설정하고 싶습니까?

<ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b"> 
    <li data-role="list-divider" class="mid">Neue News</li> 
    <li> 
     <a href=""> 
     <img src="news.png" height="40px"/> 
     <h2>Title</h2> 
     <p>Subtitle</p> 
     </a> 
    </li> 
</ul> 

Answer 1

아마 이런 식으로 뭔가 :

http://jsfiddle.net/TgkKf/6/

<ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b"> 
    <li data-role="list-divider" class="mid">Neue News</li> 
    <li class="newsLink"> 
    <a href=""> 
    <img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcTy-aBig-8SnIgGIlBOWmy_yMPLTIhXvB77apn5LoHoP1M7k6SCag" height="20px" /> 
     <div class="wrapperDiv"> 
      <h2>Title</h2> 
      <br /> 
      <div style="font-size:8px;">Subtitle</div> 
     </div> 
     <div style="clear:both;"></div> 
    </a> 

    </li> 
<li> 
    asdf 
</li> 
</ul> 

CSS

.newsLink 
{ 
    vertical-align:text-top; 
} 

.newsLink h2 
{ 
    font-size:10px; 
} 

.newsLink .wrapperDiv 
{ 
    line-height:10px; 
    float:left; 
} 

.newsLink .wrapperDiv div 
{ 
float:left; 
} 

.newsLink img 
{ 
    float:left; 
} 

.newsLink h2 
{ 
    float:left; 
    padding:0; 
    margin:0; 
} 
.newsLink div 
{ 
    padding:0; 
    margin:0; 
}