Board index Premium Layouts and Themes Ronin p:inputText Wid100 Ronin v2.1.2

p:inputText Wid100 Ronin v2.1.2


Post 24 Nov 2016, 15:53

Posts: 2
p:inputText Wid100 Ronin v2.1.2

I'm having trouble making my inputText width 100%
The inputText component is wider than the page (footer)

Below is my html

<ui:define....
   <div id="index">
      <h:form id="indexForm">
         <div class="ContainerIndent">
         <div class="Container">
         <div class="Container100">
            <p:inputText id="companyCorporateIdentity" styleClass="Wid100" maxlength="11" value="" />
         </div>
         </div>
         </div>
      </h:form>
   </div>
</ui:define>


In the attached image below, to the right (arrow) you can see the inputText is wider than the page.
This hapens for both phone, iPad and desktop

Image

Image url:
https://www.vedin.pp.se:443/photo/share ... 332e504e47


Posts: 1845
You can try box-sizing:border-box with Wid100;
<p:inputText id="companyCorporateIdentity" styleClass="Wid100" style="box-sizing:border-box" maxlength="11" value="" />

If you want to do width 100% of components, please use ui-fluid in parent html tag;

<ui:define....
   <div id="index" class="ui-fluid">
      <h:form id="indexForm">
         <div class="ContainerIndent">
         <div class="Container">
         <div class="Container100">
            <p:inputText id="companyCorporateIdentity" maxlength="11" value="" />
         </div>
         </div>
         </div>
      </h:form>
   </div>
</ui:define>


Posts: 2
Thank you!

Both suggested solutions are working! :)


Posts: 1845
Glad to hear, thanks for the update!


Return to Ronin