0

iPhone アプリの WebView で、一部のデータを他のテキスト内に埋め込むために、2 列の上揃えの固定幅レイアウトを作成しようとしています。2 番目の列のすべてのアイテムがきちんと整列されるように、最初の列を固定幅にする必要があります。
HTML、CSS、またはその両方を使用して、SO とネットから多くのソリューションを試しましたが、常に失敗しました。列幅は保持されず、エントリは上揃えになりません。

コンテンツの例:

最初の列:

Address  
Distance  
Ticket price

2 列目:

12-26-3 Kami Itabashi, Itabashi-ku, Tokyo  
23km   
350 Yen

これは私の最初の質問ですので、ご容赦ください。

必要に応じて、CSS スタイル シートを提供できます。

4

1 に答える 1

0

質問は明確ではありませんが、とにかく：

HTML

<div class="frame">
    <div class="l">
        <p>Address</p>
        <p>Distance</p>
        <p>Ticket<span>price</span></p>
    </div>    
    <div class="r">
        <p><span class="number">12-26-3</span>Kami Itabashi, Itabashi-ku, Tokyo  </p>
        <p><span class="number">23km</span></p>
        <p><span class="number">350</span>Yen</p>
     </div>    

</div>

CSS

p{
    height:20px;
    color:#000000;
    margin: 20px 0px;
    color:#000000;
}
.frame{
    width:310px;
    height:150px;
    background:#A0A0A0;
}
.number{
    color:#8D0000;
}
.l{
 float:left;   
}

.r{
    width: 220px;
    float:right;   
}

JSFIDDLE

于 2013-07-16T07:34:03.960 に答える