Home>

For pages with the

text centered
I want to cancel centering only for
    that specifies the class ".no-center", but not () does not work.
    How should I describe it ...

    Corresponding source code
    <main>
    <section>
         Title 
      <p>text<p>
      <ul>
       <li>List</li>
       <li>List</li>
      </ul>
    </section>
    </main>
    .center: not (.no-center) {
        text-align: center;
    }
    What I tried

    ■ Delete the space of .center: not (.no-center)
    → .center: not (.no-center)

    ■ Specify "center" in

    instead of

    The results did not change in either case.

  • Answer # 1

    not () does not work.

    It works, but regardless of that,text-align: centerThere are two reasons for this.

    text-alignIsInheritanceBecause it will be done.center: not (.no-center)Matched to

    Inheritance fromAs welltext-align: centerIs applied.

    .center: not (.no-center)ToInside

    Also matches.

    So if you want to achieve what you intended,.centerOnlytext-align: centerPut on.no-centerAnd anothertext-alignYou need to put in and overwrite.

  • Answer # 2

    Isn't it just that the section is centered?

    .center>section>: not (.no-center) {
      text-align: center;
    }