title: css targeting specific div tags in a large HTML web page
body: <p>In relation to my previous <a href="https://stackoverflow.com/questions/4924177/css-to-mark-up-text-to-look-like-the-sample-provided">question here</a>.
  If I am using the below HTML code as part of my web page, where there will likely be many more div tags, how can I target these particular divs in my CSS ? The sample I think works best is [This Answer][2].</p>
  
  <p>I added Id attributes to make the divs more selectable in a large HTML DOM... I don't know how else to make them more distinguishable. If there is a better method for doing so please let me know. The goal is to apply the CSS design to about 6 div tag elements inside a large share point portal website. If there is a more generic way that would be cool so I can easily add more sections and use this format in the future... I can add a class attribute to each element I want the formatting applied to, but I don't know the syntax.</p>
  
  <p>What's the designer professional web way of getting this done?</p>
  
  <pre><code>&lt;div id="projectName"&gt;
         Realtime Account Activiation
  &lt;/div&gt;
  
  &lt;div id="divAnnounce"&gt;
          Announcements
  &lt;/div&gt;
  </code></pre>
  
  <p>I have
  <a href="http://jsfiddle.net/eW532/1/" rel="noreferrer">http://jsfiddle.net/eW532/1/</a></p>
  
  <p>I am using the code below but getting bad results where the entire horizontal length is blue but not the first letter. I'm trying to have an html element use two classes together.</p>
  
  <pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head runat="server"&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;style type="text/css"&gt;
          .even_spacing {  color: purple;
                          background-color: #d8da3d }
  
          .first_letter {  background:blue;
                          color:white;
                          padding:4px 0px 4px 5px;}           
    &lt;/style&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
      &lt;form id="form1" runat="server"&gt;
  
      &lt;div class="first_letter even_spacing"&gt;
          Realtime Account Activiation
      &lt;/div&gt;
  
      &lt;div class="first_letter even_spacing"&gt;
          Announcements
      &lt;/div&gt;
      &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>