Uploaded image for project: 'OpenOLAT'
  1. OpenOLAT
  2. OO-2142

Checkbox positions don't move when scrolling "rights"-table



    • Type: Bug
    • Status: Closed (View Workflow)
    • Priority: Minor
    • Resolution: Fixed
    • Affects Version/s: 10.4.11
    • Fix Version/s: 10.5.5
    • Component/s: None
    • Labels:


      How to reproduce:

      • Login as coach and open a course
      • navigate to tools / Members Management / Rights
      • Make your window size small so that the table does not fit completely on the screen and horizontal scrollbars appear
      • use the scrollbars to scroll horizontally

      Expected Result

      • the table moves together with its content (the checkboxes)

      Actual Result:

      • the table (e.g. column headers) moves, but the content (checkboxes) stay at their position. Only when resizing the window, the positions are being corrected and the checkboxes jump to the correct position.

      The attached screenshot shows an example where the checkboxes even have been moved over the text.

      Browser used: Firefox 47.0 under Ubuntu Linux
      This might also involve a browser bug.

      Reason of the bug:
      The checkbox input elements are positioned absolutely in CSS for no obvious reason:

      .radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"]
      margin-left: -20px;
      position: absolute;

      This is from the themes.css of the VCRP OLAT installation, but I checked the default "openolat" theme in hg and it includes a similar rule:

      src/main/webapp/static/themes/openolat/theme.css @ 6897:cb72b7c8b04c

      .radio input[type="radio"],
      .radio-inline input[type="radio"],
      .checkbox input[type="checkbox"],
      .checkbox-inline input[type="checkbox"] {
      position: absolute;
      margin-left: -20px;
      margin-top: 4px \9

      This is from the current development version, so I'd expect that the bug is in all latest versions that use the openolat theme or a theme based on it.

      Removing the position:absolute in the CSS makes the checkboxes behave normally. This fix also changes the vertical position slightly, but this can be corrected easily by adding some margin-top.

      It might be that this fix causes problems in another context where the absolute positioning is required. As a general rule, I would think that inside of a tabel cell (td), no absolute positioning should be applied on the checkboxes.




            • Assignee:
              srosse Stéphane Rossé
              crazy4chrissi Christopher K.
            • Votes:
              0 Vote for this issue
              3 Start watching this issue


              • Created:

                Time Tracking

                Original Estimate - Not Specified
                Not Specified
                Remaining Estimate - 0 minutes
                Time Spent - 15 minutes