handling many similar div tags

I have many similar div tags in my page in this form

  <div class="singleline" style="width: 524px; height: 25px;">
  <p>&nbsp;</p>
  </div>

Now I want to use a css file to give different alignments to these tags. I am not able to do this because eve开发者_如何学运维rything in the tag is the same including the content.

The additional limitation is that I cannot change (or add) to the div tag contents either.

Can somebody help me?

The best option I could see you using is CSS3 pseudo-selectors.

http://www.w3.org/TR/css3-selectors/#structural-pseudos

You'd be looking to use the :nth-child or nth-of-type() which would allow you to select individual div's in order on the page.

However, if the order of elements needed to change, or a new div is inserted above others, this would require a lot of reordering work in the CSS.

Your best option, if at all possible, is to give the div's individual unique IDs.

Your question is indeed confusing.I agree with SuperPaperSam but if the issue is that you cannot change your HTML I would suggest (if possible) using javascript to manipulate your DOM, to either directly edit the style of the divs or to add a class name or ID on them which will allow them to be styled by your CSS.