0

これが可能かどうかはわかりませんが、JavaScript がこの問題を解決できることを願っています。作業中の WordPress テンプレート内の各ページのタイトルを示す DIV があります。

<div class="grid-block" id="page">

  <div id="page-info">

    <h3>#<?php is_home() ? bloginfo('description') : wp_title("",true); ?></h3>

  </div><!-- #page-info -->

</div><!-- .grid-block #page -->

DIV に呼び出されるテキストは、さまざまな長さで入力され、DIV を超えてしまうこともあります。テキストが DIV を超えると、折り返されますが、単語が折り返された後、この DIV の「高さ」を調整しようとしています。何らかのタイプの eventListener などを追加できるかどうかはわかりませんが、純粋な HTML や CSS には、この問題を解決するために必要なコンポーネントがないようです。

さらに、@media (メディアクエリ) を使用してこの効果をエミュレートできることは理解していますが、私が知る限り、これはウィンドウの幅に関連してのみ実行できます。文字列がこの DIV の幅を超える場合にのみ、サイズを変更する DIV。私がやろうとしていることのデモはhttp://jsfiddle.net/justinbyrne001/SP3Q2/4/にあります。この件に関するコメント、推奨事項、アドバイスをいただければ幸いです。前もって感謝します。

4

1 に答える 1

0

#page-info の高さを修正する必要がありますか? padding:10 のみを使用すると、div#page-info がテキストを自動的にラップします。

于 2013-05-25T12:27:35.337 に答える