ESP8266 Community Forum

- Sat Aug 20, 2016 5:26 pm #53436 For V3 A41

Code:

Button "Set A/C ASSIST",[setpt] ' allows me to enter a temperature
textbox setp


The code allows me to input a temperature - it works fine .

The issue is the textbox provides input space which is much to large.
Is there a method to make the setbox input space much smaller??
(I only need it wide enough for 4 or 5 digits at most. )


Thanks
Joe

- Sat Aug 20, 2016 7:17 pm #53441 Ok. So here is the deal.

You can style each element of your gui by using the the cssid command.

The trick is to create the gui element and immediately after set the css code for it.

The htmlid() functin will return the ID of the last gui element created. The css id command will aaply css code to that particular element.

Code: Select alltextbox setp
cssid htmlid(), "background-color:green;display:block;width:80px"



Serial terminal in the chrome browser see https://serialTerminal.com

http://esp8266basic.com
A BASIC interpreter for your ESP

Working now on Autodrop3d. A 3d printer with automatic part ejection system. https://autodrop3d.com

- Sat Aug 20, 2016 9:04 pm #53452 Mmiscool,

Thanks that solved it.

Is it possible to center the value as well?
The number is now left justified.

current code:

I added ----> align-content:center in the css code but no change

wprint "<table align='center' width='130' bgcolor='#e6e600' border='5' cellpadding='5'>" ' creates my box
wprint "<td>"
Button "Set A/C ASSIST FAN TEMP",[setpt]
textbox setp
cssid htmlid(), "background-color:lightblue;display:block;align-content:center;width:105px"
wprint "<th</th></table><br>"

Thanks
Joe

- Sat Aug 20, 2016 9:46 pm #53455 I might suggest looking at the following link for CSS.

http://www.w3schools.com/css/default.asp

Serial terminal in the chrome browser see https://serialTerminal.com

http://esp8266basic.com
A BASIC interpreter for your ESP

Working now on Autodrop3d. A 3d printer with automatic part ejection system. https://autodrop3d.com