Combo with larger image

Hi.
I'm trying to use a larger image in a combo (32x32).
I defined a new style:
.aw-image-admin {background: url(/img/admin.png); width:32px; height:32px;}  and set size of combo:

var cstart = new AW.UI.Combo;
cstart.setSize(100, 32);
cstart.setId("comboStart");
cstart.setControlText("Admin");
cstart.setControlImage("admin");
cstart.setItemText(["Home", "Config", "PTC"]);
cstart.setItemCount(3);
document.write(cstart);  All is ok for height but the width overlap with the text of combo.
Is there a solution for non overlapping combo text?

Thanks,
Marco - Milano,Italy

Bump...

Something like this -

<style>

.aw-image-admin {background: url(/img/admin.png);}

#comboStart .aw-item-image {
    width:32px;
    height:32px;
    margin-top:-15px;
    margin-bottom: -15px;
}

.aw-gecko  #comboStart .aw-item-text {
    left: 36px;
}

</style>
<script>


var cstart = new AW.UI.Combo;
cstart.setSize(100, 32);
cstart.setId("comboStart");
cstart.setControlText("Admin");
cstart.setControlImage("admin");
cstart.setItemText(["Home", "Config", "PTC"]);
cstart.setItemCount(3);
document.write(cstart);

</script>
 

Thanks, works fine.

this is the same in javascript without style:

var cstart = new AW.UI.Combo;
cstart.setSize(100, 32);
cstart.setId("comboStart");
cstart.setControlText("Admin");
cstart.setControlImage("admin");
cstart.setItemText(["Home", "Config", "PTC"]);
cstart.setItemCount(3);
cstart.getContent("box/text").setStyle("left", "36px");
cstart.getContent("box/image").setStyle("height", "32px");
cstart.getContent("box/image").setStyle("width", "32px");
cstart.getContent("box/image").setStyle("margin-top", "-15px");
cstart.getContent("box/image").setStyle("margin-bottom", "-15px");