How add additional css classes to description field in webform component?

Question

I want to add additional CSS classes to webform component description field.

in default mode, this item is wrapped inside a div element with "description" class like below:

<div class="description">here is description text</div>

Now I want to add extra CSS classes beside description.

How can I do this? via a module and form alter operation or via theme functions hook?

Please guide me.

check this drupal.stackexchange.com/questions/68453/… – Adi Sep 23 '15 at 5:17 — Adi, Sep 23 '15 at 5:17

Shivank · Accepted Answer · 2013-12-20 06:12:25Z

1

you can do this by using jquery on ready do this something like

jQuery(document).ready(function() {
         jQuery('#YOUR_FORM_ID .description').addClass('new-desc-class');
});

answered Dec 20 '13 at 6:12

Shivank

593 bronze badges

I know this solution but it is not useful when javascript is disabled on browser. – Mehrdad201 Dec 20 '13 at 10:02

Add a comment |

Mołot · Accepted Answer · 2013-12-19 19:01:43Z

0

Looks like you are looking for webform classes module:

A simple, small add-in that adds an editable class against each webform component to the webforms module.

Then, in your CSS use .class-on-form-element .description instead of .class-on-description - one word more, but works just as well.

answered Dec 19 '13 at 18:41

Mołot

21.6k7 gold badges53 silver badges110 bronze badges

Does it add class to description too ? – Mehrdad201 Dec 19 '13 at 18:55
@Mehrdad201 Not sure what description is, in Form API terms. If #description then no, as Drupal can't do it in the first place. No hooks / attributes for it. For code solution, see how I hacked it here and here. Code from these answers + code from module above will give you a kickstart. Or simply add class to element and then in css use .element's class .description – Mołot Dec 19 '13 at 19:00
Dear @Mołot I tested it, It doesn't add the class description, it is add the class to the element. I am studying your mentioned URLs. but I want to add only some extra CSS to the description element and I think there must be a solution for it without a large number of code lines. I am still searching. I think description must have #prefix and #suffix and I want to find how can I change it's rendering style. – Mehrdad201 Dec 19 '13 at 19:08

Add a comment |

2 Answers 2