1. Home
  2. Development
  3. RE: Increase height of aui:input type="text" in liferay

RE: Increase height of aui:input type="text" in liferay

thumbnail
Karthik V S, modified 12 Years ago.
Increase height of aui:input type="text" in liferay
Regular Member Posts: 106 Join Date: 12/21/11 Recent Posts
hi

I awant to increase the height of a textbox in liferay in aui:input type="text". How can we achive it. I have used size property but it is increasing only the width of a textbox but not the height. If we use style, it is not working. If we put say height="30", then alos it is not working.

Need help with this regard.

Thanks in advance.

With regards,

V S Karthik
thumbnail
meera prince, modified 12 Years ago.
RE: Increase height of aui:input type="text" in liferay
Liferay Legend Posts: 1111 Join Date: 2/8/11 Recent Posts
Hi
Use Google chrome inspect element feature and look for what are the css have been used by input. then override those CSS.

or else try

<aui:input type="text" id="name" name="name" style="height:30px;"/>


Regards,
Meera Prince
thumbnail
Karthik V S, modified 12 Years ago.
RE: Increase height of aui:input type="text" in liferay
Regular Member Posts: 106 Join Date: 12/21/11 Recent Posts
hi meera,

Thanks for the solution which can be done through firebug (inspecting Element).
But by using style="height:30px; in aui:input property, it is not working.

With Regards,

V S Karthik
thumbnail
Pankaj Kathiriya, modified 12 Years ago.
RE: Increase height of aui:input type="text" in liferay
Liferay Master Posts: 722 Join Date: 8/5/10 Recent Posts
Use cssClass attribute to aui:input tag.

<aui:input cssclass="abcClass" name="abc">
		</aui:input>


And have css defined for that class.

.abcClass{
height:30px;
}
thumbnail
Karthik V S, modified 12 Years ago.
RE: Increase height of aui:input type="text" in liferay
Regular Member Posts: 106 Join Date: 12/21/11 Recent Posts
hi pankaj,

I had done the method that you had specified but it is not working. i.e it is not reflecting to the TextBox when css class is added.

With Regards,

V S Karthik
thumbnail
meera prince, modified 12 Years ago.
RE: Increase height of aui:input type="text" in liferay
Liferay Legend Posts: 1111 Join Date: 2/8/11 Recent Posts
Hi
yes when we pass css class that will used for <span> tag not for <input/> element that is why its not effected.

But direct style tag should work i don't know why its not worked..check its once again
<div id="mycontainer">
<aui:input type="text" id="name" name="name" style="height: 30px;"/> it should work

</div>

or ovveride css properties in ur local jsp
<style>
#mycontainer .aui-field-input-text{
height: 30px;
}
</style>

Regards,
Meera Prince