Text entry display problem

I’m using the following innerhtml to setup my text entry box

<input style="width: 98%; height: 19px; font-size: 13px; border: thin grey; padding: 0px; font-family:HelveticaNeue-Light; text-align: center" type="text" id="1" placeholder="text" maxlength="8">

The problem I’m having is the text box has a white background instead of being transparent. For example in the image above I just want the text without the white rectangle. The other problem I’m having is I can’t change the text color. I’ve tried color: black - but that doesn’t seem to be working.

Make the div holding the innerHTML the same color as your scenes background color, then try adding this to your CSS code…

background-color: inherit; color: black;

the “color: black” part, is the text color (which should have worked for you) unless you are trying to color the “placeholder” text.

BTW: You can’t use a number as the first character to name an elements “id” – (id=“1”) should be (id=“a1”)

You should be able to use,

background-color: transparent;

i.e

<input style="width: 98%; height: 19px; font-size: 13px; background-color: transparent; border: thin grey; padding: 0px; font-family:HelveticaNeue-Light; text-align: center" type="text" id="a1" placeholder="text" maxlength="8">

Greg, Mark,

The transparent did the trick.

Yes, greg you are right. I was seeing the issue on the placeholder text.

Thanks