Image in player board appears outside

[Bids]

Hi all!
I'm trying to add things to the playerboard. When I add something before the player score it works fine, but when I add something after the player score or as a last item of the playerboard, it always appears outside the playerboard under it. The code I'm trying to use is this:

Code: Select all

dojo.place( this.format_block('jstpl_cardwon',{player_id : player_id, turn : 1, x : 220}), 'player_board_' + player_id);

and for the tpl:

Code: Select all

var jstpl_cardwon = '<div class="cp_board">\
<span id="cardswon_board_${player_id}"> "cards won:" <div class="cardwon" id="cardwon_${player_id}_${turn}" style="background-position:-${x}px">\
</div></span>\
</div>';					

What it is going wrong here?

[Victoria_La]

It depends on css properties of other stuff which is not shown here.
On unrelated note "cards won:" should be in template as this is translatable string

[Bids]

Hi,
thanks for your reply! Good point about the translation string, I'll fix that already.
My CSS for cardwon looks like this:

Code: Select all

.cardwon {
	position: absolute;
	margin-top: 4px;
	width: 20px;
        height: 20px;
	background-image: url('img/cardswon.png');
}

[Victoria_La]

So these have absolute postoning so they appear on top of each other, if you want auto-layout use

position: relative;
display: inline-block

[Bids]

wow great! I really thought I had to solve this in the tpl or js file thanks a lot, you're amazing!