Referencing a Changing CSS ID

I should preface this by saying I'm a complete beginner in the world of editing CSS, so I apologize if this is very simple. I've been editing reports I've built in MicroStrategy 9.4, but we recently upgraded to 10.1. Before the upgrade, I was able to look at lines of the HTML, such as

<div ty="dsec" id="K1" scriptclass="mstrDocSectionImpl" name="K1" class="mstrDocSection">

and make minor edits. An example would be something like

<style>
    #K1{
        height:130px;
    }
</style>

to just make a simple height change for a section. I could paste that Style change into an HTML container, which would effect the report at run time. I believe the K1 refers to an ID. However, after the upgrade, the line has been changed to

<div id="*lK3*kK1*x1*t1454966440926" k="K1" class="mstrmojo-DocSection" style="">

where id="..." changes each time I run it. Since it changes, I do not know of a reliable way to edit that section. The k="K1" does not change, but I'm not sure how to reference this. Any insight you can provide into this is greatly appreciated.

Solution

Try using an attribute selector:

[k="K1"] {
  height: 150px;
}

Demo JSFiddle

Although this might be a bit more work it looks like the new ID (id="") might be partially static. That is, the asterisks appear to be separators of some kind. If so, you could optionally select on a portion of that ID string that doesn't change. In my example below I'm assuming that data between the second and third asterisk in *lK3*kK1*x1*t1454966440926 doesn't change. If so you could select on that portion of the string.

[id*="kK1"] {
  font-size: 5em;
}

Demo JSFiddle