0

I have installed advanced forum and facing the weird issue. When I hover on the configuration button gear the area covered by it shows off-page as in the image(dotted line which automatically shows in drupal modules). I did check on two sites, in case my one site has the css issue. And due to this in my one site the page border of the main-content page sifting all the way to left. You can see the dotted line in the image. For the complete views I have zoom out the browser and you can see the how entire layout gets sifted in the second image.

Edit-2:

I have created the sandbox link with a Username: admin and password: admin. If you hover on the configuration gear of the views forum tab, it shows dotted line, but the left side dotted line has no end (off the page). Why this issue matters because when I create the page-border, page border also gets off-page along with that. This happens with Firefox browser only as described in the Edit-1.

Edit-1:

I did check in all browsers, and this is happening in Firefox browser only. My current browser is 45.0.1 which is the latest one. I did check in chrome and safari also, but there is no issue.

enter image description here

Image after zooming out the browser.

enter image description here

Improve this question
6
  • What is your question? This only happens in the admin interface, is that an issue for you? Are you interested in why this is happening or do you want a solution? Please edit your question to include those details. – Neograph734 Mar 30 '16 at 23:21
  • This is the issue and I need the solution as it is changing the layout as you can see in the just posted second image, the main-content border also sifting along with that. And this is off shifting of border is visible with all users. And I have also mentioned in the details the page border is shifting in one of site hence obviously it is a issue and person needs solution. – CodeNext Mar 30 '16 at 23:24
  • Ok, I thought it was only about the dotted line in your first picture (which was the only picture when I wrote my comment). – Neograph734 Mar 30 '16 at 23:33
  • Ok, that it true previously there was only one image hence I posted second one for better understanding. Can you please think of what could be the issue, as something sifting the entire left side. Thanks in advance. – CodeNext Mar 30 '16 at 23:35
  • Are you sure you haven't done anything custom? By default the forum pages do not seem to have contextual links (the gear icon). Feel free to have a look. The link expires in 24 hours: r0bkb.ply.st/forum/2 username and pass are admin. – Neograph734 Mar 30 '16 at 23:45
3
+50

The issue that a contextual link is causing your page to break. Please note that this issue only occurs for users that have permissions to modify panels, so your end users (visitors) should not see this.

The solution could be to disable the contextual link on the panel. Or disable the contextual links module entirely (what would remove the gear icon everywhere).

To disable contextual links only on some pages you might want to look at this question for how to disable a specific link: Is it possible to remove the contextual link for deleting a node?

Or you could try the Hide Contextual Links module.

UPDATE:

The main cause of this issue is a firefox bug, where outlines are drawn around descendant elements: https://bugzilla.mozilla.org/show_bug.cgi?id=687311

You can see it asked here on stackoverflow: https://stackoverflow.com/questions/10662902/css-outline-different-behavior-behavior-on-webkit-gecko, where the recommended action is to replace the outline with a box-shadow (no dashes), or the alternative to append overflow: hidden to the element. I tried with overflow: hidden and that worked so I'd try that first to keep the dashed line.

In Drupal, in you theme's css add:

.contextual-links-region-active {
  /* Override the old outline */
  outline: none !important; 

  box-shadow: 0px 0px 0px 1px #FFF;
  /* OR */
  overflow: hidden;
}

But once again, this is a firefox bug that is likely to influence only administrators who have permissions to modify panels (I have no idea about the company you are building this for, but that cannot be many users). So ask yourself if it is worth putting effort into this.

UPDATE-2: by@codenext,

As @Neograph734 has provided the very nice research on this issue in above UPDATE(basically it is FIREFOX BUG). Please follow the following comments and question details to understand the issue. I am just providing the final solution as final solution is just the extension of this answer.

SOLUTION: The main issue is, the outline(left part) of the contextual-link-region goes off the page as shown in the second image above(a dashed line area), and along with that it takes the page-border/outline css off the page too. Hence we can put the overflow:hidden; in the #page/#content-column selector(as in my case, I have put border: and outline: css in these selectors) instead of putting it in .contextual-links-region. Hence, this way you can prevent the displacement of page-border and outline which caused the .contextua-links-region(originally the firefox bug).

Improve this answer
6
  • Hmmm..it happens due to contextual gear, or probably some css related to that. Now this happening for other users also, probably css effect getting applied everywhere. I tried to disable contextual module also, but no help. Now I created new panel page to check whether it is happening for every panel, bit everything there fine there. Hence it is specif to the advanced forum, I should check the issue on advanced forum module or on contextual module, probably I will raise the issue on advanced forum module. Thanks for suggestions and input. – CodeNext Mar 31 '16 at 0:39
  • Updated the answer. It is caused by a firefox bug. – Neograph734 May 20 '16 at 12:09
  • Hhmmm...I must say, You found the issue..:)..I tried, but (1) It is not working with the .contextual-links-region-active selector, but it is working with .contextual-links-region and as you said overflow: hidden; only needed, hence it is working with that. 2. Some weird reason, This problem gets solved for only administrator but not for log-out user (anonymous user), hence it is working either way. I did check with .contextual-links-region-active as well as .contextual-links-region. Any further thought??, it is very near. I am also trying to figure out inline of your answer. – CodeNext May 20 '16 at 13:18
  • I still fail to see why anonymous user have access to contextual links. They should not be able to use those and apart from that, they should not be able to modify panels. I do not understand the problem you are having here. – Neograph734 May 20 '16 at 13:27
  • I just double checked all permissions, even first removed every permission from anonymous and then added one by one, so anonymous can just view those contents. But this solution is working other way, if role has permissions then this solution works, for example Administrator. – CodeNext May 20 '16 at 14:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.