Bernie
Posts: 0
Joined: Fri Jul 27, 2012 2:06 pm

Textinput only as a line instead a box

I am trying to apply the following CSS classes to a mobiletextinput with the goal of just getting a line instead a box for it.

.myinput {
border-top-style: hidden;
border-right-style: hidden;
border-left-style: hidden;
border-bottom-style: groove;
background-color: #ffffff;
}

.no-outline {
outline: none;
}

somehow the preview inthe page editor looks different then the test run.
Both arr not showing what I try to accomplish.

Any help?

Image

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

Textinput only as a line instead a box

Hello Bernie,

Do you need to apply these styles to all input components or only for the specific one?
Please use the following CSS for that: prediv.ui-input-text{
border: none;
box-shadow: none;
}/pre

Bernie
Posts: 0
Joined: Fri Jul 27, 2012 2:06 pm

Textinput only as a line instead a box

Hi Serhii,
Thank you. This is what I ended up using:

Created a new CSS:

div.ui-input-text{
border: none;
box-shadow: none;
border-top-style: hidden;
border-right-style: hidden;
border-left-style: hidden;
border-bottom-style: groove;
background-color: transparent;
}

Works for all the textinputs in that app.

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

Textinput only as a line instead a box

Thank you for the update! Glad it works now!

Return to “Issues”