Differen height of input- and select-fields in rio-theme

Locked
Dupp
Posts: 3
Joined: 15 Jan 2016, 16:01

08 Mar 2016, 17:23

Hello,

why have the inputfields and the select-fields different heights in Rio Theme?

Example: Image

I can't find the reason... beacause the inner elements have not a higher height...

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

09 Mar 2016, 16:48

The DOM structures of this components are different from each other. Therefore, their fields may vary according to the parent content.
Example;
inputText;

Code: Select all

<div class="ui-panelgrid-cell ui-grid-col-4">
<input id="mask" name="mask" type="text" class="ui-inputfield ui-inputmask ui-widget ui-state-default ui-corner-all" role="textbox" aria-disabled="false" aria-readonly="false">
</div>
oneMenu;

Code: Select all

<div class="ui-panelgrid-cell ui-grid-col-4">
    <div id="onemenu" class="ui-selectonemenu ui-widget ui-state-default ui-corner-all">
           ....
         <label id="onemenu_label" class="ui-selectonemenu-label ui-inputfield ui-corner-all">Select One</label><div class="ui-selectonemenu-trigger ui-state-default ui-corner-right">
          <span class="ui-icon ui-icon-triangle-1-s ui-c"></span>
    </div></div>
</div>

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

09 Mar 2016, 16:53

Maybe, you can use display: inline-flex; for this issue, but it isn't supported by IE9. This is a workaround.
.ui-selectonemenu .ui-selectonemenu-label {display: inline-flex !important;}

Not: we can not make this change in our side. We support IE9-* for Layouts and IE8-* for PrimeFaces core.

Locked

Return to “Rio”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 2 guests