Problem with SetupCSS for a custom textfield

Targets Web
1

Hi,all!
I’m making a custom textfield using WebControlWrapper,but I’m having problem with setupCSS

This is the SetupHTML:

  dim tmp as string
  tmp =  "<div id="""+self.ControlID + """>" + "<form>"
  tmp = tmp +"<input type=""text"" name = ""firstname"" placeholder = ""Username"">"
  tmp= tmp+"</div>"
  
  return tmp

SetupCSS:

 Styles(0).Selector = "#" + self.ControlID
  Styles(0).Value("border") = "1px dotted #00000"
  Styles(0).Value("outline") = "0"
  Styles(0).Value("height") = "25px"
  Styles(0).Value("width") = "400px"

The CSS isn’t working,where is the problem?

2

Ciao Diego,
you have used #00000 instead of #000000
to avoid these mistake is better to use rgb(0,0,0) or rgba(0,0,0,1).

3

It works but it looks like this:

A textfield in the texfield

4

I don’t know. This is not the same code you have posted.
Please repost the SetupHTML and SetupCSS code

5

Yes,sorry

I changed the Setup CSS:

Styles(0).Selector = "#" + self.ControlID Styles(0).Value("background") = "#1A1A1A" Styles(0).Value("border-radius") = "2em" Styles(0).Value("height") = "25px" Styles(0).Value("width") = "275px" Styles(0).Value("border")="none" Styles(0).Value("color")="#A2A2A2" Styles(0).Value("padding-left")="1.5em" Styles(0).Value("outline")="none" Styles(0).Value("box-shadow")="0 4px 6px -5px hsl(0,0%,40%) , inset 0px 4px 6px -5px hsl(0,0%,2%)"

6

You are styling the box (div)

add this to your setup css
dim css as WebControlCSS
css=new WebControlCSS
Styles.Append css
css.selector="#"+self.ControlID+" input"
css.value(“background-color”)=“rgba(0,0,0,0)”
css.value(“border”)=“0”
css.value(“color”)=“rgb(255,255,255)”
css.value(“height”)=“20px”
css.value(“margin”)=“1px”
css.value(“width”)=" calc(100% - 1.5em)"

btw why are you using a “form” tag? (it’s not even closed)

7

It Works!Thanks!

8

For what it’s worth, you can’t change the selector on styles(0). That style always refers to a div with an id attribute matching the control ID.

9

Right.
However Diego problem was about a wrong color code and how set the css for the inner element.