0

I'm trying to customize the font size for the label text but in the meanwhile I need that the font-size affects only the text and not the checkbox button. This is my code:

    .check-field-privacy:not(.Form-fieldIcon) {
     font-size: 12px;
    }
<label class="check-field-privacy Form-label Form-label--block" for="checkprivacybox">
     <input type="checkbox" class="Form-input" id="checkprivacybox" aria-required="true" required="">
     <span class="Form-fieldIcon" role="presentation"></span> Privacy Policy
    </label>

But it seems not working for some reason. The checkbox is affected itself by this rule.

What's wrong and how can I write a rule to set the size of the font only for the label but excluding the ?

Thanks in advance.

Smollet777
  • 1,618
  • 1
  • 16
  • 15
Francesco
  • 387
  • 5
  • 17
  • 1
    The `label` doesn't have the `Form-fieldIcon` class. – Jean-Marc Zimmer Nov 08 '18 at 10:47
  • 1
    It's not working because you are using it wrong - the not means that the first selector does not include the second selector - it doesn't mean that the first selector does not contain a child element with the second selector. There is currently no css to do what you want – Pete Nov 08 '18 at 10:52

1 Answers1

0

you can directly target the span element

.check-field-privacy span{
  font-size:12px;
}

hope this helps!!

Suhas NM
  • 960
  • 7
  • 10
  • I want the opposite of what you suggested: only the shouldn't have font-size: 12px – Francesco Nov 08 '18 at 10:51
  • do you want the checkbox size to be increased? – Suhas NM Nov 08 '18 at 10:53
  • or the text which is in the span should be affected? – Suhas NM Nov 08 '18 at 10:53
  • @Francesco just set the font size for the span separately then – Pete Nov 08 '18 at 10:55
  • I don't want to set the font size of the span separately. I want to leave it as is (2em) but not affecting it size with the css rule on the label. Is it possible? – Francesco Nov 08 '18 at 11:01
  • That is not possible, every element inherits it’s parents css unless overridden. So your label tag has a css defined, unless u override your span tag with different css it will inherit properties from label tag. – Suhas NM Nov 08 '18 at 11:05