!important declaration causes overlay issues when moving the Top Menu User Panel.

  • I've been working on a theme and have run into a small issue.




    The following is in the main CSS...


    CSS
    .interactiveDropdown {
    position: fixed;
    top: 50px !important;
    }


    This means that the only way to change where the dropdown appears is to put yet another !important declaration with a different height. However, I also noticed this...


    Code
    element {
    inset: 81px 266px auto auto;
    }


    The JS is apparently set up to properly determine the position for the dropdown, BUT the aforementioned !important declaration in the main CSS overrides it.

  • Are you using the older version of WBB. As that background theme image looks like the one uses with the older version of WBB forum

  • The declaration coming from the JavaScript is there for compatibility reasons as far as I know. Since it’s no more used in WoltLab Suite Core 3.1 it needs to be overwritten already in the base style. That’s why you need to overwrite it again with !important in order to set a custom value.

    Plugins, Designs, Hosting, Support und mehr: KittMedia

  • Yeah, the previous theme was pretty nice looking. I ran that version for a while and preferred that theme look to this one now