ICEmobile
  1. ICEmobile
  2. MOBI-1086

headerText of dataViewColumn is no longer wrapping and causing header and column misalignment

          Details

          • Type: Bug Bug
          • Status: Resolved
          • Priority: Major Major
          • Resolution: Won't Fix
          • Affects Version/s: EE 1.3.0.GA_P01
          • Fix Version/s: None
          • Component/s: Faces
          • Labels:
            None
          • Environment:
            jsf icemobile

            Description

            Will attach the acemobile example app. Basically you just need to put longer headerText value(s) in the dataViewColumn and the headerText (which used to wrap in 1.3.0 release) no longer wraps and the headers and contents no longer align in the component.

            Since it did previously, thought we should create a Jira and then reinforce what normal ability/behavior is.

            create the app, then go to <url address>:8080/acemobile/accordionMissingContent.jsf

            sent_content_small.xhtml page differs from previous with only this line....
                      <mobi:dataViewColumn headerText="Cost has heading longer than columnn" value="$ #{car.cost}"
                                               reactivePriority="2" />
            (showing the extra length of the headerText value).

              Activity

              Ascending order - Click to sort in descending order
              Hide
              Permalink
              Judy Guglielmin added a comment -

              when long headerText is used on the dataViewColumn, must add the following css rule:-
              .mobi-dv table th

              { white-space: initial; }
              Show
              Judy Guglielmin added a comment - when long headerText is used on the dataViewColumn, must add the following css rule:- .mobi-dv table th { white-space: initial; }
              Hide
              Permalink
              Philip Breau added a comment - - edited

              And likewise, if you want data region text to wrap instead of ellipsis add the following:

              .mobi-dv table td

              { white-space: initial; }
              Show
              Philip Breau added a comment - - edited And likewise, if you want data region text to wrap instead of ellipsis add the following: .mobi-dv table td { white-space: initial; }
              Hide
              Permalink
              Philip Breau added a comment -

              The current style is intended to avoid alignment issues by avoiding wrapping and overflow. If not wanted the CSS override will work.

              Show
              Philip Breau added a comment - The current style is intended to avoid alignment issues by avoiding wrapping and overflow. If not wanted the CSS override will work.

                People

                • Assignee:
                  Philip Breau
                  Reporter:
                  Judy Guglielmin
                • Votes:
                  0 Vote for this issue
                  Watchers:
                  2 Start watching this issue

                  Dates

                  • Created:
                    Updated:
                    Resolved: