ICEfaces
  1. ICEfaces
  2. ICE-2302

Firefox rendering problems with <ice:panelTab/> and <ice:selectInputDate/>

          Details

          • Type: Bug Bug
          • Status: Closed
          • Priority: Major Major
          • Resolution: Fixed
          • Affects Version/s: 1.7DR#2
          • Fix Version/s: 1.7DR#3, 1.7
          • Component/s: None
          • Labels:
            None
          • Environment:
            Windows / Liferay 4.3.3 + Tomcat 6.0.13

            Description

            This is very easy to reproduce. Simply download any of the sample-icefaces* portlets from the Liferay website and stick it in your Liferay 4.3.3 "hot deploy" folder.

            When you visit the portlet with Firefox, you'll see a problem with the rendering of the <ice:panelTab/> component, in that the left edge doesn't line up right with the form below.

            Additionally, the date field is really tall and has a wierd font. Firebug reveals that the css "class" attribute has a value of "iceSelInpDateInput Input portlet-form-input-fieldInput" which is likely the problem. It's appending "Input" to the portlet-form-input-field class for some reason. This is remenicent of ICE-1621.

            I tried this with ICEfaces 1.6.0 and also the trunk as of 10/31/2007 and both have the same problem.
            1. screenshot-4.jpg
              108 kB
            2. screenshot-3.jpg
              114 kB
            3. screenshot-2.jpg
              191 kB
            4. screenshot-1.jpg
              25 kB

              Activity

              Ascending order - Click to sort in descending order
              Hide
              Permalink
              Neil Griffin added a comment -

              This screenshot has red circles around the problem renderings.

              Show
              Neil Griffin added a comment - This screenshot has red circles around the problem renderings.
              Hide
              Permalink
              Neil Griffin added a comment -

              Regarding the wierd font thing, there are actually two problems that we're dealing with:

              1) The problem I mention above, where the word "Input" is appended
              2) A bug in Firefox, whereby the following code in the Liferay theme is not being applied:

              input[type="text"], input[type="password"], input[type="file"],input[type="submit"], input[type="button"], input[type="reset"], select, textarea, .textarea

              { font: 1em 'Tahoma','Lucida Sans Unicode','Lucida Grande','Lucida',Arial,Verdana,sans-serif; }

              Firefox SHOULD apply to the HTML <input> field that is rendered by SelectInputDateRenderer.java BUT Firefox does not do it.

              Show
              Neil Griffin added a comment - Regarding the wierd font thing, there are actually two problems that we're dealing with: 1) The problem I mention above, where the word "Input" is appended 2) A bug in Firefox, whereby the following code in the Liferay theme is not being applied: input [type="text"] , input [type="password"] , input [type="file"] ,input [type="submit"] , input [type="button"] , input [type="reset"] , select, textarea, .textarea { font: 1em 'Tahoma','Lucida Sans Unicode','Lucida Grande','Lucida',Arial,Verdana,sans-serif; } Firefox SHOULD apply to the HTML <input> field that is rendered by SelectInputDateRenderer.java BUT Firefox does not do it.
              Hide
              Permalink
              Neil Griffin added a comment -

              I have a fix for problem #2 above with the wierd font in FireFox:

              When I added this with FireBug:

              type="text"

              Then Firefox FINALLY applied the Liferay style. It might have something to do with the fact that ICEfaces renders this <input> inside a <div> or something... I don't know.

              In order to fix this programmatically, add the following code on or about line 180 of SelectInputDateRenderer.encodeEnd():

              dateText.setAttribute(HTML.TYPE_ATTR, "text");

              Show
              Neil Griffin added a comment - I have a fix for problem #2 above with the wierd font in FireFox: When I added this with FireBug: type="text" Then Firefox FINALLY applied the Liferay style. It might have something to do with the fact that ICEfaces renders this <input> inside a <div> or something... I don't know. In order to fix this programmatically, add the following code on or about line 180 of SelectInputDateRenderer.encodeEnd(): dateText.setAttribute(HTML.TYPE_ATTR, "text");
              Hide
              Permalink
              yip.ng added a comment -

              Testing fix for class and type attribute values.

              Show
              yip.ng added a comment - Testing fix for class and type attribute values.
              Hide
              Permalink
              yip.ng added a comment -

              Testing fix for tab alignment.

              Show
              yip.ng added a comment - Testing fix for tab alignment.
              Hide
              Permalink
              yip.ng added a comment -

              Regression testing on IE.

              Show
              yip.ng added a comment - Regression testing on IE.
              Hide
              Permalink
              Neil Griffin added a comment -

              Verified as fixed during testing of ICEfaces 1.7RC1

              Show
              Neil Griffin added a comment - Verified as fixed during testing of ICEfaces 1.7RC1

                People

                • Assignee:
                  Unassigned
                  Reporter:
                  Neil Griffin
                • Votes:
                  0 Vote for this issue
                  Watchers:
                  0 Start watching this issue

                  Dates

                  • Created:
                    Updated:
                    Resolved: