Transitioning Wordpress menu layout from horizontal to vertical

On several websites with the same template and content but different locations, only one site is experiencing menu display issues.

I have attempted deleting and re-adding the menu, as well as copying it from another working site, but the problem persists.

For reference, here is a functional website: www.faceup-romanorte.com

And here is the site with the problematic menu: www.faceup-cancun.com

<div data-elementor-type="header" data-elementor-id="178" class="elementor elementor-178 elementor-location-header" data-elementor-post-type="elementor_library">
            <div class="elementor-element elementor-element-32e6cb8 e-con-full e-flex e-con e-parent" data-id="32e6cb8" data-element_type="container" data-settings="{&quot;background_background&quot;:&quot;classic&quot;,&quot;motion_fx_motion_fx_scrolling&quot;:&quot;yes&quot;,&quot;motion_fx_devices&quot;:[&quot;desktop&quot;,&quot;tablet&quot;,&quot;mobile&quot;]}" data-core-v316-plus="true">
                <div class="elementor-element elementor-element-c8d0c33 e-con-full e-flex e-con e-child animated fadeIn" data-id="c8d0c33" data-element_type="container" data-settings="{&quot;animation&quot;:&quot;fadeIn&quot;,&quot;animation_delay&quot;:200}">
                    <div class="elementor-element elementor-element-aaadcca de_scroll_animation_no elementor-widget...

No changes were made to the CSS or custom code for this menu, yet the issue persists.

https://i.sstatic.net/OUWzr.png

https://i.sstatic.net/nhRc5.png

htmlcsswordpress

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Button with a Jquery icon design

Hello, I am currently working on implementing an icon button that can collapse and expand text. Although I have successfully implemented the logic for collapsing/expanding, I am facing difficulties in creating the actual icon button. The theme I am require ...

javascriptjquerycssjquery-ui

chart.js version 3 does not display the correct date data on the time axis

Struggling to make chart.js work with a time axis is proving to be quite challenging for me. The code I have is as follows: <html> <head> <script src="https://cdn.jsdelivr.net/npm/moment"></script> <script src="https://cdnjs.clo ...

javascripthtmlchart.jschart.js3

Utilize the href attribute on an image, whether it be through a class

I work as a designer and I'm looking to extract the same href link from class="kt-testimonial-title", either in id="slick-slide10", or in class="kt-testimonial-item-wrap kt-testimonial-item-0", or in class="kt-testimonial-image". Can this be achieved ...

javascripthtmljquerywordpress

Ways to Fix the React Hydration Issue in Next.js

I have been encountering an issue with the error message "Hydration failed because the initial UI does not match what was rendered on the server." I am unsure of what is causing this error and would appreciate any insights or suggestions from others who ma ...

javascripthtmlreactjsnext.js

Exploring the wonders of CSS with Socialchef

Hey, I recently came across a solution on Stack Overflow where they provided code for SocialChef to convert decimal inputs into fractions. I'm wondering how I can write or incorporate some code to input fractions and mantissa as a fraction... I ...

phpcss

Leverage the power of Angular by configuring a custom webpack setup to

Implementing the CSS modules concept in my Angular app has been a challenge due to conflicts with existing frontend CSS. My project utilizes SCSS, and I am looking for a way for webpack to modularize the CSS generated from SCSS during the final build step. ...

cssangularwebpackwebpack-style-loadercss-loader

Experiencing an issue of receiving an undefined value while attempting to retrieve a value from an input box

HTML: <input value='Rename' type='button' onclick='RenameGlobalPhase({$row['id']});' <span id='renameGlobalPhase{$row['id']}'>" . $row['phase'] . "</span> Below you wil ...

javascriptjqueryhtml

optimal method for organizing design elements

I have a container with 9 square-shaped divs that I want to arrange in the following layout: It should resemble something like this: _________ ____ ____ | A | B | C | | |____|____| | | D | E | |_________|____|____| | F | G | ...

htmlcsslayoutflexbox

Creating a fixed column in an Angular Material Table for enhanced user experience

Has anyone found a method to implement a sticky first column in Angular Material using CSS? Check out the editable Stackblitz code here. I attempted to modify this approach from https://jsfiddle.net/zinoui/BmLpV/, but encountered issues where the first c ...

cssangularangular-material-5

Arranging images and text side by side with varying breakpoints using Bootstrap classes

In my layout, I have an image and text side by side, with the image appearing first and the text to its left. My goal is to display the text above the image when the screen size is reduced to a small breakpoint, and then switch back to the original layou ...

htmlbootstrap-4

Using Laravel to connect custom fonts

After previously discussing and experimenting with linking custom font files in Laravel, I encountered an issue where the fonts were not displaying correctly on my website. Due to Laravel's router, directly linking to font files in CSS was posing a ch ...

phpcsslaravelfonts

Customize printing options by hiding the print button

I am looking to exclude the print button from a hard copy when it is printed. <html> <head> <title>New Page 1</title> </head> <body> <p> This is just a paragraph, and I do not want t ...

htmlcss

Issue with setting active class on current html page using Bootstrap 5 and Flask

I am currently developing a flask web application and I am focusing on customizing the navigation bar. Utilizing bootstrap 5 for styling purposes, I am attempting to apply the 'active' class when a specific navbar page is clicked with the followi ...

htmlflaskbootstrap-4navbarbootstrap-5

What is the best way to close an ajax page within the main page using a button?

I am dealing with a situation where I have 2 pages. The first page contains a div called 'ajaxicall', which loads another page inside it. The challenge I am facing is figuring out how to close the second page when I click on the "close" button w ...

javascriptjqueryhtmlcssajax

how to toggle a pre-selected checkbox in a Vue component

https://i.stack.imgur.com/6GQl7.png When dealing with a tree view checkbox in Vue, I encountered an issue where editing data within a selected zone should automatically check the corresponding countries based on previous selections. The ID of the selected ...

htmlsqllaravelvue.js

Check the Woocommerce product metadata against the customer metadata, and adjust the visibility of products accordingly

I've been working on adding geolocation functionality to my WooCommerce store for rental products. My goal is to only show these products to customers in the same city where the product is located. Instead of using a plugin, I wanted to see if I could ...

phpwordpresswoocommercegeolocationshow-hide

Absolute positioning causes an element's height to increase

As I delve into the realm of typographical animations and seek to calculate the baseline of a font at various sizes, I've stumbled upon a peculiar discovery: It appears that the height values of elements tend to increase in an erratic manner when thei ...

javascripthtmlcss

On smaller screens, the top placement of right sidebar links is necessary

Our website layout is organized into 3 main sections: the top part contains the main menu, followed by the main content and a sidebar specific to each page. The main content and sidebar are structured using bootstrap col-* classes. On small screens, I en ...

javascripthtmlcssbootstrap-4

Introducing a variety of sub-menu fonts within an elegantly designed jQuery vertical accordion menu

I am struggling to achieve different font sizes, colors, and weights for top and sub-menu level links in my simple jQuery vertical accordion. Despite changing the CSS, I can't seem to get it right. What am I missing? Is there an easy way to accomplish ...

jqueryhtmlcssaccordion

To access the link, simply click once if there is no child menu. However, if there is a child menu attached, be sure to click

I am working on a mobile menu that is designed to slide out when clicked. Currently, the parent pages are displayed by default. I want to implement functionality where if a parent page has child pages, clicking on it will slide down the sub menu. If click ...

javascriptjqueryhtmlcss