title: CLeditor uses the HTML 'align' attribute.  How can I change that to CSS 'text-align'?
body: <p>I've set up the CLeditor on a site I'm working on.  Currently I'm setting it up so that as you type and edit within the editor, you can see a live preview of the results just above it, a lot like what you get when typing a StackOverflow question, though much more basic.</p>
  
  <p>It works by simply copying the inner HTML of the iframe contents to another place on the page.  However I've run into an annoying issue.  When I use the alignment buttons (left, center, right), it adds the attribute <code>align="right"</code>, for example, to the selected text.  While it works in the editor, it does not work on the page itself, probably because that attribute is pretty much obsolete.</p>
  
  <p>...</p>
  
  <p>I actually figured out how to get around this issue while typing this question. Still, I'll post this question with my solution.  Plus I have a relevant question to add to this.</p>
  
  <p>Originally I tried applying the following CSS to the page:</p>
  
  <pre><code>div[align="right"] {
      text-align:right!important;
      }
  </code></pre>
  
  <p>This worked for initially loading the data onto the page, but while dynamically changing alignment in the editor, the live preview was not reflecting the changes.  I thought at first that this was because the styles were applied at load time only.</p>
  
  <p>Well, that was a brain fart because I know better than that.  The real problem was that I was selecting a DIV element and the align attribute isn't necessarily applied to a DIV.  Changing <code>div[align="right"]</code> to <code>*[align="right"]</code> works perfectly.  </p>
  
  <p>However, even though I found a workaround for this specific issue, I still can't figure out how the cleditor builds the HTML output for the iframe.  Where does the <code>align</code> attribute come from in the code and how does it know to put it (and all of the other elements/attributes) into the HTML?  If I had a way of manipulating this, I could simply tell it to use inline CSS for the alignment rather than the deprecated <code>align</code> HTML attribute.  Please note that I do not wish to enable the cleditor's built-in "useCSS" feature.</p>
  
  <p>Thanks for any information you can share, and please do not downvote this question just because I already solved the initial problem.  I want this to be able to help others if they run into the same issue.  (I'll also post my answer as an answer).</p>