CSS Formatting question

I have a simple tile driver that displays text on a dashboard tile. It also changes color. For some reason the background is not the full width of the tile. Below is the code I am using. If I change the width to more than 100% it does make it fill out but then the text is offset. I'm sure this is simple, but I can't quite figure out what to change. Any ideas?

def sendTile(color,textData) {
textTile += "<div style='color: black; height: 150%; background-color: ${color};"
textTile += "position: absolute; left: 0; top: -30%; width: 100%;'>"
textTile += "<div style='position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);'>"
textTile += "${textData}</div></div>"

sendEvent(name: "Text", value: textTile, displayed: true)
	log.info "Text displayed on dashboard."

}

What tile template are you using to display it?

Using attribute with Text as the selected attribute.

That one displays the content from the tile-secondary div IIRC. It’s about 2 layers down into the tile, and so will need a little manipulation - lot of good examples in this thread: