How to implement CSS in elements within a given id or class?

Question

<div id="chart-id-149" class="big_number_total">
  <div class="superset-legacy-chart-big-number  no-trendline" style="height: 98px;">
    <div class="header-line" style="font-size: 18px; height: 49px;">
      <span>30</span>
    </div>
    <div class="subheader-line" style="font-size: 3px; height: 30px;">% Conversions</div>
  </div>
</div>

Kindly note that I want to reference subheader-line class for the id: chart-id-149. So the condition should be the text within id of chart-id-149 and class subheader-line should have the colour blue.

Here's what my code looks like:

#chart-id-149.subheader-line {
    color: blue;
}

But I see no effect, please do let me know where am I going wrong.

please note you say you wish the .subheader-line to contain blue text but the css is targeting .header-line — Ramon de Vries
– Ramon de Vries, Commented Jun 3, 2020 at 14:00
@LukasJ thanks, yeah this sorted my problem. Ramon de Vires thanks, made the correction. — Shivam Sahil
– Shivam Sahil, Commented Jun 3, 2020 at 14:03

Vikas Dubey · Accepted Answer · 2020-06-04 04:04:47Z

2

you are missing a space before dot (.)

#chart-id-149 .header-line
{
    color: blue;
}

edited Jun 4, 2020 at 4:04

answered Jun 3, 2020 at 14:05

Vikas Dubey

831 silver badge12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

j08691 · Accepted Answer · 2020-06-03 14:01:58Z

1

Descendant elements are selected with a space in CSS, so you need:

#chart-id-149 .header-line

answered Jun 3, 2020 at 14:01

community wiki

j08691

Collectives™ on Stack Overflow

How to implement CSS in elements within a given id or class?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related