CSS: Ignore Indent on Center aligned text

1.2k views Asked by At

Just started posting stories and essays online and I've found a couple sites that have very basic text editors that don't allow a lot of basic formatting unless you apply a CSS Workskin. After searching through the topics here I found some useful Code but ran into some problems. What I want to know is if there's a way to set Center Aligned text to ignore Indentation without setting it to a specific Class?

#workskin p {
  text-indent: 45px;
}

I have the above set to indent the first line of every paragraph but it also indents everything that's centered which skews it off-center. I hope there's some adjustment to the above code that forces it to ignore center aligned text.

#workskin p.chapter {
  text-align:center;
  text-indent:0;
}

I learned how to set a Class as above to correct this but some of the postings I'll be making will require hundreds or thousands of center-aligned lines so I'm really hoping I can do it with some Code rather than having to manually set them to a Class. Thanks for any help you can give!

EDIT: To specify what I'm asking for, I want to force all center aligned text to have 0 indent so I don't have to manually insert:

<p class="chapter">

Thousands of times.

Paragraph --- want Indent
Paragraph --- want Indent
Centered text/divider/chapter title/ect... ---- do NOT want Indent
Paragraph --- want Indent
Centered text/divider/chapter title/ect... ---- do NOT want Indent
pattern continues randomly

2

There are 2 answers

1
Sleek Geek On BEST ANSWER

Just do something like:

 #workskin p.chapter {
      display: block;
      text-align:center;
      text-indent:0!important;
     /* "!imporatnt" ensures that it overrides
     previous indent property set, if the value 0 
     and specification doesn't solve the problem */
    }

To indent just the first paragraph do something like below, none of the other paragraphs will not indent.

#workskin p:first-of-type { /* Targets just the first paragraph */
     text-indent: 45px;
}
1
Greg Burghardt On

The first style has a more specific selector than p.chapter so the text indent remains at 45px. You also need:

#workskin p.chapter {   
    text-align:center;
    text-indent:0;
}