0

Web サイト用の「ブロック引用」ボックスを作成しようとしていますが、端の周りに引用符を設定するのに苦労しています。正しい高さを取得できないため、テキストが囲み続けます。それらはテキストに沿って配置され、エントリコンテンツのテキストが段落全体でインデントされるようにする必要があります。

引用符を独自の div 内に配置し、それに応じて高さ/幅を設定しましたが、実際の引用テキストが含まれる div の高さを動的に決定できないようです。

これは、親 div が動的な性質のために特定の高さを持っていないためだと思われますが、動的な高さを設定する方法が完全にはわかりません。

ページの例は次のとおりです。

http://192.241.203.146/kim-dotcom-launches-mega-co-nz/

しかし、私が実際にやろうとしていることの例は、次の画像で見ることができます: ここに画像の説明を入力

div を描画するコードは次のとおりです。

 <div class="span8">
    <div class="quotation qopen">“&lt;/div>
    <div class="entry-content">
        <p>Schlitz magna whatever, aesthetic aliqua odio duis yr lomo american apparel 3 wolf moon meggings ullamco next level Truffaut. Ullamco ennui cillum, scenester plaid next level do bitters twee american apparel enim four loko. Proident eu cornhole, biodiesel umami bespoke velit est do jean shorts literally quis ut stumptown. Polaroid kitsch squid jean shorts, aliqua you probably haven&#8217;t heard of them qui beard sint id odio tofu veniam Schlitz sartorial. Disrupt placeat bicycle rights tousled letterpress. Mustache sartorial +1, vero next level squid non american apparel. Messenger bag Marfa hoodie anim you probably haven&#8217;t heard of them selvage, ugh gentrify accusamus PBR wayfarers Wes Anderson occupy.</p>
        <div class="quotation qclose">”&lt;/div>

CSS:

 .quotation
 {
font-size:4.0em;
font-weight:600;
width:30px;
height:100%;
 }

 .qopen
{
float:left;
width:30px;
position: relative;
}

.qclose
{
float:right;
}

.entry-content { 
font-size:1.0em;
font-family: Agilis;
line-height:150%;
}

これに関するヘルプは大歓迎です。私はこれに数日間立ち往生しており、まだ学んでいます-それはばかげた質問だと確信しています.

4

2 に答える 2

-1

わかりました、これは思ったほどトリッキーではありませんでしたが、jQuery を使用して質問に答えました。動的コンテンツが読み込まれた後、div の高さを動的に見つける必要があることがわかりました。

私が使用したコードは次のとおりです。

<script>
$(document).ready(function(){
$(".qopen").height( $(".entry-content").height() );
});
</script>
于 2013-07-07T04:01:07.200 に答える