Jetspeed 2
  1. Jetspeed 2
  2. JS2-483

buggy css layouts / patch for table based layout

    Details

    • Type: Bug Bug
    • Status: Closed
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: 2.1-dev
    • Fix Version/s: 2.1-dev, 2.1
    • Component/s: Layout
    • Labels:
      None

      Description

      The current css based layouts are broken on Mozilla/Firefox. Columns are glued to the left instead of being arranged side by side. Imho css layouts are generally still very buggy.

      I switched back (again) to table based layouts and noticed some side effects regarding font sizes in IE and some problems with the customizer. I believe some of the recent changes (esp. with the 2.0 final release) to the portal layout have not been adapted to the tcolumns/layout.vm.

      So I wrote a new table based layout.vm and used the actual css based layout.vm as a master. I just inserted two or three tables and removed the css width attributes.
      This now works as expected and exactly looks like the css based layout.
      I'd like to see the attached patch to be applied. Please read a comment in the patch about a workaround to handle .99% widths.

      Regards, Thorsten

      1. tcolumns-patch-JS2-483-edit_mode.txt
        1.0 kB
        Thorsten Berger
      2. tcolumns-patch-JS2-483.txt
        3 kB
        Thorsten Berger
      3. ColumnLayout-JS2-483.txt
        2 kB
        Thorsten Berger
      4. default-page_firefox_1.0.7.jpg
        297 kB
        Thorsten Berger
      5. default-page_ie6.jpg
        321 kB
        Thorsten Berger
      6. default-page_ns72.jpg
        331 kB
        Thorsten Berger
      7. table-layout-patch.txt
        15 kB
        Thorsten Berger

        Activity

        Hide
        Randy Watler added a comment -

        Please supply the version of the browsers you were using. The buggy css floating divs 'columns' layouts have been tested on a number of firefox and IE browser versions and the appearance was normal... so naturally we would like to pin down such a claim. Including your screen resolution will also be helpful.

        Similarly, what version of IE were you using that failed to parse the X.99% column widths correctly?

        The 'tcolums' table based layout is under major overhaul to fix many of the same problems you have attempted to address. Please test the pending commit and see if it works for you when it is released.

        Thanks for the patch... hopefully we have these issues covered!

        Show
        Randy Watler added a comment - Please supply the version of the browsers you were using. The buggy css floating divs 'columns' layouts have been tested on a number of firefox and IE browser versions and the appearance was normal... so naturally we would like to pin down such a claim. Including your screen resolution will also be helpful. Similarly, what version of IE were you using that failed to parse the X.99% column widths correctly? The 'tcolums' table based layout is under major overhaul to fix many of the same problems you have attempted to address. Please test the pending commit and see if it works for you when it is released. Thanks for the patch... hopefully we have these issues covered!
        Hide
        Thorsten Berger added a comment -

        Thanks for your quick reply.

        Regarding the CSS layouts:
        I tested the latest trunk (2.1-dev) of Jetspeed on both Netscape 7.2 and Firefox 1.0.7 and all columns are glued to the left. This is independent of the screen resolution. IE6 has no problems. I'll include a screenshot of both browsers.

        After writing the new table based layout, there were no problems with Mozilla/Firefox any more. It could e.g. handle two columns with 50% and 49.99% width.
        Strangely, IE (6.0.2900.2180.xp_sp2_gdr) had problems with the second column of 49.99% width. The result was a very narrow column. Specifying both columns with 50% worked correctly. Hence the ugly workaround. This odd behaviour does IE only have with table widths, not with css widths....

        Show
        Thorsten Berger added a comment - Thanks for your quick reply. Regarding the CSS layouts: I tested the latest trunk (2.1-dev) of Jetspeed on both Netscape 7.2 and Firefox 1.0.7 and all columns are glued to the left. This is independent of the screen resolution. IE6 has no problems. I'll include a screenshot of both browsers. After writing the new table based layout, there were no problems with Mozilla/Firefox any more. It could e.g. handle two columns with 50% and 49.99% width. Strangely, IE (6.0.2900.2180.xp_sp2_gdr) had problems with the second column of 49.99% width. The result was a very narrow column. Specifying both columns with 50% worked correctly. Hence the ugly workaround. This odd behaviour does IE only have with table widths, not with css widths....
        Hide
        Raj Saini added a comment -

        I have similar problem on Firefox 1.5 when I using "25/75 Two Columns Layout. Using Velocity". However, it works fine on IE. Firefox and IE screenshots are attached.

        Operating Environement

        OS: Windows XP: Professional
        Browser: Mozilla Firefox 1.5
        Screen Resolution: 1280x1024
        Jetspeed Version: Latest source build from JETSPEED-2.0.1BRANCH

        Show
        Raj Saini added a comment - I have similar problem on Firefox 1.5 when I using "25/75 Two Columns Layout. Using Velocity". However, it works fine on IE. Firefox and IE screenshots are attached. Operating Environement OS: Windows XP: Professional Browser: Mozilla Firefox 1.5 Screen Resolution: 1280x1024 Jetspeed Version: Latest source build from JETSPEED-2.0.1BRANCH
        Hide
        Steffen Dienst added a comment -

        Hi,

        I have the same problem and would love to have the patch accepted. I don't think that css layouts are the way to go yet as no single browser besides opera 9 pass the acid2 test. Is there any progression on this issue?

        Show
        Steffen Dienst added a comment - Hi, I have the same problem and would love to have the patch accepted. I don't think that css layouts are the way to go yet as no single browser besides opera 9 pass the acid2 test. Is there any progression on this issue?
        Hide
        Ate Douma added a comment -

        Well, I just checked out the patch but I'm sorry to say its way outdated now.
        I happen to have rewritten both the colums and the tcolumns template for JS2-468 and this patch simply cannot be applied as such anymore.

        Now, if someone still thinks the current (2.1-dev trunk version) Jetspeed-2 tcolumns is buggy and can provide a valid patch,
        I'm more than willing to review that and, if feasible, apply it.
        If not, I probably close this issue soon as being no longer valid.

        Show
        Ate Douma added a comment - Well, I just checked out the patch but I'm sorry to say its way outdated now. I happen to have rewritten both the colums and the tcolumns template for JS2-468 and this patch simply cannot be applied as such anymore. Now, if someone still thinks the current (2.1-dev trunk version) Jetspeed-2 tcolumns is buggy and can provide a valid patch, I'm more than willing to review that and, if feasible, apply it. If not, I probably close this issue soon as being no longer valid.
        Hide
        Thorsten Berger added a comment -

        Ate,

        I hadn't updated my jetspeed from the svn head for two months now (never touch a running... .

        I built the latest head today and unfortunately the two problems still exist:

        • css: columns are glued to the left with Mozilla/Firefox
        • tcolumns: font size problems with IE

        I'll invest some time the next days and use your tcolumns/layout.vm as a template.

        Regards, Thorsten

        Show
        Thorsten Berger added a comment - Ate, I hadn't updated my jetspeed from the svn head for two months now (never touch a running... . I built the latest head today and unfortunately the two problems still exist: css: columns are glued to the left with Mozilla/Firefox tcolumns: font size problems with IE I'll invest some time the next days and use your tcolumns/layout.vm as a template. Regards, Thorsten
        Hide
        Ate Douma added a comment -

        Great.
        I've already assigned this issue to myself and looking forward to a new patch

        Show
        Ate Douma added a comment - Great. I've already assigned this issue to myself and looking forward to a new patch
        Hide
        Thorsten Berger added a comment -

        Ate,

        I finally found (after some hours of trial and error) the reason why all windows are glued to the left in Mozilla/Firefox:
        In the ColumnLayout class, the last column width is formatted by DecimalFormat, which is Locale dependent....
        So I have a width of "49,99%" (notice the comma) instead of "49.99%" with my German Locale and Mozilla/Firefox doesn't understand this.

        A patch for the ColumnLayout class is attached.

        Regards, Thorsten

        Show
        Thorsten Berger added a comment - Ate, I finally found (after some hours of trial and error) the reason why all windows are glued to the left in Mozilla/Firefox: In the ColumnLayout class, the last column width is formatted by DecimalFormat, which is Locale dependent.... So I have a width of "49,99%" (notice the comma) instead of "49.99%" with my German Locale and Mozilla/Firefox doesn't understand this. A patch for the ColumnLayout class is attached. Regards, Thorsten
        Hide
        Ate Douma added a comment -

        Great catch Thorsten and thanks for the patch!

        I've applied your patch (slightly modified).

        Now, this only leaves your tcolums font size problems with IE, right?

        Show
        Ate Douma added a comment - Great catch Thorsten and thanks for the patch! I've applied your patch (slightly modified). Now, this only leaves your tcolums font size problems with IE, right?
        Hide
        Thorsten Berger added a comment -

        Ate, thanks for applying my patch.
        I also found the reason of the font size problem: It's a missing DOCTYPE (xhtml transitional) in tcolumns/layout.vm. But don't ask me why IE gets confused by that (imho it assumes a html 4 DOCTYPE then, but that doesn't explain the different font sizes).

        The attached patch tcolumns-patch-JS2-483.txt also contains some very small fixes of tags the w3c validator complained about.
        I still have some minor problems with IE and will try to solve them soon.

        Regards, Thorsten

        Show
        Thorsten Berger added a comment - Ate, thanks for applying my patch. I also found the reason of the font size problem: It's a missing DOCTYPE (xhtml transitional) in tcolumns/layout.vm. But don't ask me why IE gets confused by that (imho it assumes a html 4 DOCTYPE then, but that doesn't explain the different font sizes). The attached patch tcolumns-patch- JS2-483 .txt also contains some very small fixes of tags the w3c validator complained about. I still have some minor problems with IE and will try to solve them soon. Regards, Thorsten
        Hide
        Thorsten Berger added a comment -

        Ate, thanks for applying my patch.
        I also found the reason of the font size problem: It's a missing DOCTYPE (xhtml transitional) in tcolumns/layout.vm. But don't ask me why IE gets confused by that (imho it assumes a html 4 DOCTYPE then, but that doesn't explain the different font sizes).

        The attached patch tcolumns-patch-JS2-483.txt also contains some very small fixes of tags the w3c validator complained about.
        I still have some minor problems with IE and will try to solve them soon.

        Regards, Thorsten

        Show
        Thorsten Berger added a comment - Ate, thanks for applying my patch. I also found the reason of the font size problem: It's a missing DOCTYPE (xhtml transitional) in tcolumns/layout.vm. But don't ask me why IE gets confused by that (imho it assumes a html 4 DOCTYPE then, but that doesn't explain the different font sizes). The attached patch tcolumns-patch- JS2-483 .txt also contains some very small fixes of tags the w3c validator complained about. I still have some minor problems with IE and will try to solve them soon. Regards, Thorsten
        Hide
        Ate Douma added a comment -

        Thorsten,

        I've applied your latest patch too, thanks again.

        Please let me know if now all issues are addressed so I can close this one.

        Show
        Ate Douma added a comment - Thorsten, I've applied your latest patch too, thanks again. Please let me know if now all issues are addressed so I can close this one.
        Hide
        Thorsten Berger added a comment -

        Ate, I've just one more
        This affects the table layout again: in edit mode, IE (in opposite to Mozilla) doesn't display the portlet decorators. That's caused by the following div:
        <div style="position:relative; top:10px; left:0; width:100%; height:100%">
        I don't know what has been the intense of this line, but removing resolves the problems with IE and I don't see any drawbacks. The patch is in tcolumns-patch-JS2-483-edit_mode.txt

        I think there have been enough patches for this issue now, so feel free to close it.

        Regards, Thorsten

        Show
        Thorsten Berger added a comment - Ate, I've just one more This affects the table layout again: in edit mode, IE (in opposite to Mozilla) doesn't display the portlet decorators. That's caused by the following div: <div style="position:relative; top:10px; left:0; width:100%; height:100%"> I don't know what has been the intense of this line, but removing resolves the problems with IE and I don't see any drawbacks. The patch is in tcolumns-patch- JS2-483 -edit_mode.txt I think there have been enough patches for this issue now, so feel free to close it. Regards, Thorsten
        Hide
        Ate Douma added a comment -

        Thorston, I'll look after it when I return from vacation.
        I'm just about to shutdown my laptop and won't (be able to) open it again until after next week

        Show
        Ate Douma added a comment - Thorston, I'll look after it when I return from vacation. I'm just about to shutdown my laptop and won't (be able to) open it again until after next week
        Hide
        Ate Douma added a comment -

        Thorsten,
        Sorry about the delayed handling of the last issue but now eveything is committed

        Show
        Ate Douma added a comment - Thorsten, Sorry about the delayed handling of the last issue but now eveything is committed

          People

          • Assignee:
            Ate Douma
            Reporter:
            Thorsten Berger
          • Votes:
            1 Vote for this issue
            Watchers:
            2 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved:

              Development