Drop down menus out of alignment after upgrade.

This topic has 6 replies, 2 voices, and was last updated 2 years, 5 months ago by Skandha.

Viewing 7 posts - 1 through 7 (of 7 total)

Author

Posts
June 17, 2021 at 9:23 am #284688

Glyn
Participant

Hi
Just upgraded to the latest version of Catch Kathmandu Pro 5.2.5 and the page size no longer filled the screen so added the following into Additional CSS –

.site {
width: 100%;
margin: auto;
}

That worked OK but and the menu is where I want it but the dropdown menu boxes don’t line up, looks like they are all over to the left. The text is OK and appears to be right aligned within the box.

Can’t figure out what’s missing to correct this?

https://holthouse.sheffield.sch.uk/

Many thanks

June 17, 2021 at 11:34 pm #284707

Skandha
Participant

@rextherunt: Hello there,
Catch Kathmandu Pro is a boxed theme so it doesn’t extend to the full width of the screen. The CSS you used should solve that issue.

Regarding the drop down menu it seems to be showing up fine. Can you please elaborate the issue with the drop down menu? Do you want to decrease the width of the drop down menu boxes?

Kind Regards,
Skandha

June 18, 2021 at 4:15 am #284722

Glyn
Participant

Hi Skandha

I’ve attached screen prints to show what’s happening.

#1 Shows the drop down menus lining up with the right hand edge of the menu headers, this kicks the boxes out to the left.

#2 Is a similar site that I’ve not updated Catch Kathmandu on. The dropdown menus align to the left hand edge, which is how I would like it to be. https://carterknowle.sheffield.sch.uk/

#3 Shows a ‘random’ occurrence of the menu contracting in width and showing blank boxes underneath the menu headers. This ones a puzzle and I assumed it might be a ‘cache’ issue but having cleared and reset all cache from multiple PCs and the host server it seems to persist!
Performing a screen refresh (F5) several times can clear it but not always.

Kind regards
Glyn

June 18, 2021 at 4:41 am #284723

Glyn
Participant

1. Holt House https://www.dropbox.com/s/913dc44k7504ha9/HH1.png?dl=0
2. Carterknowle https://www.dropbox.com/s/1kfwt5kdx5rarod/CK1.png?dl=0
3. Holt House (random) https://www.dropbox.com/s/1q0x83i0lpat182/HH2.png?dl=0

June 19, 2021 at 12:22 am #284792
Skandha
Participant
@rextherunt: Hello Glyn,
To align the dropdown menu to the left
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
```
.main-navigation ul li:hover > ul, .main-navigation ul li.focus > ul {
    right: auto;
    left: 0;
}
```
I am not able to replicate the HH2.png issue on my end. Are you still having this issue?

Let me know if this works out!
Kind Regards,
Skandha
June 19, 2021 at 7:46 am #284799

Glyn
Participant

Hi Skandha

Great! That’s fixed it.

The HH2 issue I believe I’ve fixed it by accident!
Not sure why it would make a difference but as I was testing different options to fix the dropdown alignment problem I moved the .site {width: 100%; margin: auto; } code from the top to further down the list of Additional CSS code.
This seems to have the desired effect,
I’ve attached a link to the current CSS if your interested from a technical point of view!
CSS Code
By having the .site {width….. code above the .entry-title { display: none; } line it creates the error.

Many thanks for your help and support, it’s really appreciated.
Cheers
Glyn

June 19, 2021 at 8:07 am #284811

Skandha
Participant

@rextherunt: Hello Glyn,
I don’t seem to have the issue at my end when I have the CSS code in the order you suggested.

I hope I was able to resolve your issue. If it’s not too much trouble, I have a quick request: could you please leave an honest review?
https://wordpress.org/support/theme/catch-kathmandu/reviews/#new-post
Your review will help others know what to expect when they’re looking for the support I offer. Even a sentence or two would be hugely appreciated. Thanks, and if there’s anything else at all that I can do to help, don’t hesitate to let me know. Have a great weekend! 🙂

Kind Regards,
Skandha
Author

Posts