simona6 Posted January 17, 2021 Share Posted January 17, 2021 I've been doing work on this website recently. I've set the main menu to be CAPS, but for some reason I cannot override the Mega Menu titles to be Capitalized. They have their own Class "menutitle", but even with that set as "Important", and nothing that appears to be loading after, I cannot see the cause. https://www.79design.org.uk I'd appreciate anyone spotting the cause to this. Thank you. Click/Hover on Services to see the menu. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/ Share on other sites More sharing options...
requinix Posted January 17, 2021 Share Posted January 17, 2021 I see one "text-transform: uppercase !important" and another "capitalize" (not !important). So obviously the !important one will override. Throwing !important on the second won't fix it because all you've done is make them of equal specificity, so the one defined later wins. Seems like you've got a lot of duplicate rules and a lot of !importants in there. Both of those are indications of problems with the CSS. Look through what you've got, cut out as much as you can without severely breaking everything, and try giving it all another shot. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/#findComment-1583821 Share on other sites More sharing options...
simona6 Posted January 17, 2021 Author Share Posted January 17, 2021 Can you show me a screenshot of both of them please. I've got important set on the Main Menu alonig the top, but cannot see two .menutitle classes with both those options. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/#findComment-1583823 Share on other sites More sharing options...
requinix Posted January 17, 2021 Share Posted January 17, 2021 This has nothing to do with .menutitle. Are you familiar with your browser's developer tools? If not then you really need to spend some time learning about them. Open your developer tools, find the menu, and consider applying the mHover class manually to force it open. Then navigate (in the tool) to the heading's A or SPAN and look at what CSS rules are being applied. I see three rules whose selectors all have a > chain that targets the link. Two of those have text-transforms. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/#findComment-1583824 Share on other sites More sharing options...
simona6 Posted January 17, 2021 Author Share Posted January 17, 2021 I use it a lot, yes. But just cannot see what is causing the menutitle to be uppercase, when I am overriding that in my CSS. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/#findComment-1583825 Share on other sites More sharing options...
requinix Posted January 18, 2021 Share Posted January 18, 2021 Forget the menutitle. Forget it. Look at the CSS rules being applied to the heading. Two of them involve text-transform. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/#findComment-1583830 Share on other sites More sharing options...
simona6 Posted January 18, 2021 Author Share Posted January 18, 2021 #grve-main-menu .grve-wrapper > ul > li > a, #grve-main-menu .grve-wrapper > ul > li.megamenu > ul > li > a, #grve-theme-wrapper #grve-hidden-menu ul.grve-menu > li > a, .grve-toggle-hiddenarea .grve-label, #grve-hidden-menu ul.grve-menu > li.megamenu > ul > li > a, #grve-main-menu .grve-wrapper > ul > li ul li.grve-goback a, #grve-hidden-menu ul.grve-menu > li ul li.grve-goback a { font-size: 14px!important; text-transform: uppercase!important; letter-spacing: 1.0px!important; } I see this at the top, which his what sets the font for the main menu itself. I've stripped out the 'megamenu' part which I think is causing it to override that, and then add that separately, but it seems to have no effect. What I think you are saying, is that if one class has the UPPERCASE assigned to it, and another class it added to it later, using a different !important method, it is ignored. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/#findComment-1583854 Share on other sites More sharing options...
requinix Posted January 18, 2021 Share Posted January 18, 2021 You found one of the text-transforms. Now find the others. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/#findComment-1583861 Share on other sites More sharing options...
simona6 Posted January 19, 2021 Author Share Posted January 19, 2021 Yep think I've sorted it. It's now Capitalized. Quote Link to comment https://forums.phpfreaks.com/topic/312013-why-are-the-mega-menu-headers-staying-caps/#findComment-1583897 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.