See-Through Menus?

[Skhilled]

I'm not sure what the heck I did but my menus seem to show "behind" menus lower than they are such as the main menu dropdown over the Admin menu. See the images...

You cannot view this attachment. You cannot view this attachment.

It's one of the weirdest things. LOL

[Bigguy]

You have to change or add a z-index in there to one of the menu's

[Skhilled]

Ah! I never knew what a z-index was. LMAO Thanks!

[Bigguy]

Hey, no problem at all. Glad I could help.

[Skhilled]

That was a bust...unless I was doing something wrong...again! LMAO

[Bigguy]

No, that should work. I have had that happen as well and that's how I fix it. By adding to editing the existing z-index code. The numbers for the z-index can go up to 100 or so as far as I know.

https://www.w3schools.com/cssref/pr_pos_z-index.asp

[Skhilled]

Ah! Now I know how it works and you've been holding out on me! It only works with the position or flex elements. And I thought you were my friend! LMAO

[Bigguy]

Lol, I was trying to be, lol. I've done a lot of editing in the past but haven't played with the menus in awhile.

[Skhilled]

I'm a bit busy cooking today but I'll check it out tomorrow.

[Bigguy]

It only works with the position or flex elements.

I was just thinking....you can change and separate things in SMF. I've had to do it a few times to get things right. I may not be explaining it right but I know what I'm sayin in my head, lol. Just thought I would put this out there.

[Skhilled]

Yeah, I know. When a new version of SMF is released I create a modified version of the default with certain elements/styles separated to make things easier for updating the themes. I haven't don't it for 2.1.x yet cause I was anxious to get the theme done. Then I just use that to start with.

[Skhilled]

Yeahhhhh, fixed! I got smart and used a clean default index.css to compare it to the one in the theme. Something was commented out that should not have been.

Code Select Expand

#main_menu .popup_container, #genericmenu > .popup_container {
 
/* display: block;
position: relative; */
background: none;
margin: 0;
height: auto; /* In case anything fishy happens in the situations where this used make sure it stays still */
}

[Skhilled]

Ok, so it is not all of the way fixed. LOL The main menu is fixed but the admin menu still does it.   Crap! I may have to start over just to make sure it is all fixed.

[Bigguy]

At least ya figured it out.

[Skhilled]

Only part of it. I've compared it over and over and still don't see what's wrong!