0

テキストのブロックが 1 つあり、それはギャラリーのレジュメです。

ギャラリーはリキッド レイアウトです。つまり、画面の幅に応じて、4 枚から x 枚の写真、たとえば 8 枚の写真を見ることができます。

私のクライアントは、テキストのブロックをこのレイアウトの幅とまったく同じにすることを望んでいますが、ご想像のとおり、画像はテキストのブロックとは別に行を変更します。

解決策が見えますか？これがコードです。うまく適合する場合は、多かれ少なかれ変更できます。重要な制限は、流動的な設計でなければなりません。

 <div class="descrip">

                                    <span>lorem ipsum lorem 
ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum 
lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem 
ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum 
lorem ipsum lorem ipsum lorem ipsum lorem ipsum</span>
                                </div>


                                <ul class="galeria">
    <li>
<a rel ="prettyphoto[1]" href="ipsum.jpg" title="">
<img src="ipsum4.jpg" alt="" height="120" /></a>
</li>
  <li>
<a rel ="prettyphoto[1]" href="ipsum.jpg" title="">
<img src="ipsum4.jpg" alt="" height="120" /></a>
</li>
  <li>
<a rel ="prettyphoto[1]" href="ipsum.jpg" title="">
<img src="ipsum4.jpg" alt="" height="120" /></a>
</li>

    </ul>
4

2 に答える 2

1

ジャバスクリプトを使おう！image-containers の幅を取得し、text-container に設定します。代わりに text-align: justify を設定します ... 見栄えが良くなるかもしれません

jQuery の例:

var containerwidth = $('#image-container').width();
$('#text-container').width(containerwidth);
于 2011-11-28T14:56:49.980 に答える
0

@ggzoneで示されているように、Javascriptとコードへの追加の変更が必要になります。

私はあなたのコードにいくつかの変更を加え、jQuery関数を追加しました-そしてそれは機能します：

http://pastebin.com/t8GxmWu9

私がしなければならなかった主な変更は、リストをスパンに変更することです-そうでなければ、幅を検出できません...

おそらくこれには回避策がありますが、私はこれに対する即時の答えを持っていません...

それが役に立てば幸い。

于 2011-11-28T15:07:45.463 に答える