title: CSS - How can I center a <script>'s output?
body: <p>I've been having a lot of trouble trying to center an external script and I was hoping SO could help me out.  I'm designing a page to use a Google widget that uses Google Maps to give directions to an office.  Here is my code:</p>
  
  <pre><code>&lt;asp:Content ID="Content1" ContentPlaceHolderID="page_content" runat="server"&gt;
  &lt;div class="centered"&gt;
  
  &lt;span class="header_large_bold"&gt;Directions to our office:&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;
  
  &lt;span class="header_bold"&gt;Please type your address in the top bar and click "Go".&lt;/span&gt;&lt;br /&gt;
  
  &lt;script src="[link to the widget here]"&lt;/script&gt;
  
  &lt;/div&gt;
  &lt;/asp:Content&gt;
  </code></pre>
  
  <p>And here is the CSS for it:</p>
  
  <pre><code>.centered {
  width: 100%;
  margin: 0 auto;
  text-align: center;
  }
  </code></pre>
  
  <p>As it is, the text is centered perfectly fine, but the widget from the  is left aligned.  I can fix this using a  tag, but I'm trying to avoid using it as best I can.  Any idea what I'm doing wrong?</p>