In custom environments, it may be necessary to apply custom styles to specific portlets. The example below gives guidance on how to override the Liferay Theme CSS in order to customize portlets to fit requirements.
Resolution
Affected Products
Liferay Portal 6.0 EE SP2 and above
Please use the example below as a reference for editing CSS for input text box color and button hover color.
1. After adding a portlet, navigate to Look and Feel > Advanced Styling.
2. Click the link "Add a CSS rule for just this portlet," and it will create the following:
#portlet_id {}3. For the text field input on focus, Liferay uses the following in main.css
input.focus,textarea.focus,.ie6 input.focus,.ie6 textarea.focus4. For the button hover
input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:focus, input[type="button"]:focus, input[type="reset"]:focus, button:hover, button:focusOnce you declare the scope as such
#portlet_id elements { styles }, then you can start declaring the styles themselves.