title: how to modify the width of search container column text?
body: <p>how to modify the width of search container column text?</p>
  
  <p>I want to change the width of the <code>&lt;th&gt;</code> table.</p>
  
  <p>I used the attribute <strong>cssClass</strong> of <code>&lt;liferay-ui:search-container-column-text&gt;</code> liferay taglib but I did not work for me.</p>
  
  <p>Table header:</p>
  
  <p><a href="https://i.stack.imgur.com/zVhYV.png" rel="nofollow noreferrer">table</a></p>
  
  <p>view.jsp:</p>
  
  <pre><code>    &lt;liferay-ui:search-container orderByCol="&lt;%=sortByCol%&gt;"
       orderByType="&lt;%=sortByType%&gt;" iteratorURL="&lt;%=url%&gt;"
       delta="10" emptyResultsMessage="no-result"&gt;
      &lt;liferay-ui:search-container-results&gt;
        &lt;% //some code %&gt;
      &lt;/liferay-ui:search-container-results&gt;
      &lt;liferay-ui:search-container-row modelVar="file"
                              className="DLFileEntry"&gt;
          &lt;liferay-ui:search-container-column-text name="Val1"
                                      cssClass="txt-capitalize width-11" value="&lt;%=value1%&gt;" /&gt;
          &lt;liferay-ui:search-container-column-text name="Val2"
                                      cssClass="txt-capitalize width-11" value="&lt;%=value2%&gt;" /&gt;
          &lt;liferay-ui:search-container-column-text name="Val3"
                                      cssClass="txt-capitalize width-11" value="&lt;%=value3%&gt;" /&gt;
          &lt;liferay-ui:search-container-column-text name="Value4"
                                      cssClass="txt-capitalize width-11" value="&lt;%=value4%&gt;" /&gt;
          &lt;liferay-ui:search-container-column-text name="Val5"
                                      cssClass="txt-capitalize width-11" value="&lt;%=value5%&gt;" /&gt;
  &lt;!-- some other search-container-column-text --&gt;
      &lt;/liferay-ui:search-container-row&gt;
      &lt;liferay-ui:search-iterator
          searchContainer="&lt;%= searchContainer %&gt;"
          paginate="${fn:length(listFiles) ge 10}" /&gt;
      &lt;/liferay-ui:search-container&gt;
  </code></pre>
  
  <p>main.css:</p>
  
  <pre><code>.width-11{
      width:11%;
      padding-left: 5px;
      padding-right: 0;
  
  }
  </code></pre>
  
  <h3>Update</h3>
  
  <p>If I inspect the code in the browser we can see the css class that exist.</p>
  
  <p><a href="https://i.stack.imgur.com/Ibecu.png" rel="nofollow noreferrer">inspect table row</a></p>