Adjust only one component

Navigation
1

With this css I change all inputs of my autocomplete : 

.ui-autocomplete-multiple ul{
    padding:0;
    background-color: red !important;
}

The problem is that I need to merge only one screen and not all of them, how can I reference it to be changed only from the screen whose id is x or step styleClass as a parameter?

EDITED

This is the generated html: 

<div id="manageEventoPermanenciaNavioForm:pidoS" class="ui-autocomplete-multiple">
  <ul class="ui-autocomplete-multiple-container ui-widget ui-inputfield ui-state-default ui-corner-all" style="float:left">
    <li class="ui-autocomplete-input-token"><input id="manageEventoPermanenciaNavioForm:pidoS_input" name="manageEventoPermanenciaNavioForm:pidoS_input" autocomplete="off" type="text"></li>
  </ul>
  <button class="ui-button ui-button-autocomplete ui-widget ui-state-default ui-corner-right ui-button-icon-only" type="button"><span class="ui-button-icon-primary ui-icon ui-icon-triangle-1-s"></span><span class="ui-button-text">&nbsp;</span></button><select id="manageEventoPermanenciaNavioForm:pidoS_hinput" name="manageEventoPermanenciaNavioForm:pidoS_hinput" multiple="multiple" class="ui-helper-hidden"></select>
</div>
    
asked by anonymous 25.04.2017 / 15:42

2 answers

1

Put the styleClass attribute on your p:autoComplete : 

<p:autoComplete styleClass="classeEstilo" />

Configure your css class as follows: 

.classeEstilo ul {
    background-color: red;
}
    
25.04.2017 / 16:19
0

To select the element by id you should sweat # :

HTML: 

<input id='id_do_elemento'>

CSS: 

#id_do_elemento{
    padding:0;
    background-color: red !important;
}

This way this style will be applied only to the target with the specified identifier.

CSS Selectors

    
25.04.2017 / 15:50
Problem with MySQL Text field How do I update a variable in a v-for in Vue JS?