1

このモックアップのように、「även uppfinnare」というテキストを右側に配置したいと思います。 ここに画像の説明を入力

これが動的データの実際の結果である場合、右端のテキストを除くすべてを表示できます。 ここに画像の説明を入力

これを行う HTML と JSP は次のとおりです。

    <div class="clear"></div>

    <div class="fl10"><h3>Sökande</h3></div>
        <% if(apc.hasSokande()) {
        if(sokandeList != null && sokandeList.size() > 0) { %>
        <% for(PersonInfo person : sokandeList) { %>
        <div class="data-box">
            <table border="0">
    <tr><td colspan=3><strong>  <% if (person.getNamn() != null) { %>
                <%= person.getNamn() %>&nbsp;
            <% } %> </strong></td></tr>
        <tr><td></td><td>Telefon</td><td><%= person.getTelefon() %></td></tr>
        <tr><td></td><td>Fax</td><td><%= person.getFax() %></td></tr>
        <tr><td></td><td>E-post</td><td><%= person.getEpost() %></td></tr>
        <tr><td><%= person.getLandKod() %></td><td>Referens</td><td></td></tr>
        </table>    
    </div>  
</div>
    <div class="clear"></div>
    <div class="fl10"></div>


        <% } %>
    <% } %>
    <% } else { %>
        <%= apc.getNyregPerson().getNamn() %>
    <% } %>

        </div>

右のテキストを実現する方法を教えてください。div と float:right を試しましたが、うまくいきませんでした。助けてください。ありがとうございました。

4

2 に答える 2

2

このような絶対配置を使用できます。

<span style='position:absolute; top:10px; right:0px;'>även uppfinnare</span>
于 2012-04-13T10:59:17.887 に答える
2

このようなデザインには、タグを使用HTML divする方が適しています。列の 2 つの div を作成します。

    <div id="personName">
      ......
   </div>
    <div id="otherDetails">
       .....
   </div>
   <br style="clear:both;"/>

CSS:

  #personName {
    float:left;
    width:300px;
    background:#9c9;
 }
 #otherDetails {
    float:right;
    width:450px;
    background:#c9c;
 }

チェック：例

于 2012-04-13T11:42:52.847 に答える