[解決済み] 別のCSSクラスの中にあるCSSクラスをターゲットにする
質問
こんにちは、私はJoomlaのいくつかのCSSクラスで問題を抱えています。あるモジュールに2つのdivがあり、1つはwrapper class="wrapper"、もう1つはcontent class="content"です。コンテンツはラッパーの中にあります。私がやろうとしていることは、content クラスに css スタイルをターゲットにすることです。通常は、スタイル・シートに .content {私のスタイル情報} を記述するだけですが、問題は、このクラスがページ全体で何度も使用されていることです。そこで、バックエンドでは、モジュールにクラス名を割り当てることができるので、私はこれを.testimonialsと名付けました。
ページ上の他のコンテンツ・クラスを変更しないようにするために、このように:
.testimonials .content {my style info I am trying to apply}
しかし、これは動作しません、私はdivでこれを行うことができることを知っているので、だから
#testimonials .content {my style info I am trying to apply}
しかし、私の質問は、これはクラスで行うことができますか? もしそうなら、私は次のように使用しようとしているので、何かが間違っている。
.testimonials .content {font-size:12px; width:300px !important;}
のように、何らかの理由でコンテンツがラップされず、段落の終わりでページの外に消えてしまうので、コンテンツが座っている第1レベルのクラスが何も重なっていないことを確認しようとしています。奇妙なことに、コンテンツが座っているdivクラスを50pxに修正しても、それはまだテキストをラップしませんので、私はそれを右ターゲットにしているかどうかわからない?
edit >>>>>>>> です。
Joomlaが作成しているhtmlは、基本的に以下のようなものです >>
<div class="wrapper">
<div class="content">SOME CONTENT</div>
</div>
をクリックすると、古き良きJoomlaのスタイルで、他の100万個のdivで包まれます。
このモジュールに testimonials というクラスを与えたので、最終的には以下のような感じになります。
<div class="testimonials">
<div class="wrapper">
<div class="content">SOME CONTENT</div>
</div>
</div>
EDIT 3 >>>>>>です。 OK、これが吐き出されるものです。
<div class="testimonials">
<div class="key4-block">
<div class="module-title"><h2 class="title">Client Testimonials</h2></div>
<div class="key4-module-inner">
<div class="module-content">
<script type="text/javascript">
RokStoriesImage['rokstories-184'].push('');
RokStoriesImage['rokstories-184'].push('');
RokStoriesImage['rokstories-184'].push('');
</script>
<div id="rokstories-184" class="rokstories-layout6 content-left" >
<div class="feature-block">
<div class="feature-wrapper">
<div class="feature-container">
<div class="feature-story">
<div class="image-full" style="float: right">
<img src="/sos/" alt="image" />
</div>
<div class="desc-container">
<div class="wrapper">
<span class="content"><p>Arrived in under 30 mins and got my pride and joy home in one piece, the day it conked out on me.</p>
<p>- Mr A Another</p></span>
</div>
</div>
</div>
<div class="feature-story">
<div class="image-full" style="float: right">
<img src="/sos/" alt="image" />
</div>
<div class="desc-container">
<div class="description">
<span class="feature-desc">
<p>Great Service ! , SOS came to the rescue me in no time at all and made my day.</p>
<p>- a customer</p>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
EDIT 4 >>>>>。
これは、それがやっていることです
解決方法は?
HTMLがどのようなものか定かではありません(それが答えの助けになるでしょう)。もし、それが
<div class="testimonials content">stuff</div>
の場合、CSSでスペースを削除するだけです。ラ...
.testimonials.content { css here }
UPDATE
さて、HTMLを見た後、これがうまくいくかどうか......。
.testimonials .wrapper .content { css here }
または単に
.testimonials .wrapper { css here }
または
.desc-container .wrapper { css here }
の3つで動作するはずです。
関連
-
[解決済み】エラー。要求されたURL"[no URL]"は無効です。
-
[解決済み] Bootstrapのカラムが機能しない
-
[解決済み] 以下のHTMLフォームの例で、「mailto:[email protected]」とは何ですか?
-
[解決済み] Visual Studio Code CSSエラー「空のルールセットを使用しないでください」【終了しました
-
[解決済み] CSSの親セレクタはありますか?
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み] CSSでテキストや画像の背景を透明にするには?
-
[解決済み] CSSの三角形はどのように機能するのですか?
-
[解決済み】HTML5入力のプレースホルダの色をCSSで変更する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】JQuery: 'Uncaught TypeError: ajaxリクエストで「Illegal invocation」が発生する - 複数の要素
-
[解決済み】Telegramマークダウンの構文。太字 *と* イタリック?(2018年9月)
-
[解決済み] このCSSでInline-blockが正しく動作しないのはなぜですか?
-
[解決済み] HTMLの#記号の文字実体は?
-
[解決済み] IE=edge,chrome=1というのは今でも有効なのでしょうか?
-
[解決済み] 背景画像を前後にパンするCSS【非公開
-
[解決済み] ChromeのデベロッパーツールでHTML Bodyにcz-shortcut-listen="true "が表示される?
-
[解決済み] SRCとHREFの違い
-
[解決済み] iFrameがURLを読み込んでいない
-
[解決済み] Bootstrap 4 の mr-auto が正しく動作しない。