I have a problem with the height of the menu

I’ve fixed the css height of 36px, but when reloading the page it’s as old and then new shrink.

Hello,

Try to add the following code snippet to the Custom CSS area in Theme Settings.

body:not(.document-ready) div.navigation-wrap .vertical-navigation,
body:not(.document-ready) div.navigation-wrap .main-nav {
    height:36px;
}

Kind Regards
XTemos Studio

Excellent, thanks a lot.
I first learned css code so.

I have a problem, because your interface does not have this form so it is very difficult for newcomers like me, I tried to do but it looks way too far.

Initially, the vast majority of sites are based on the 12 column grid system, which consists of a container, rows, and columns. All column widths have standard and generally accepted values in percentages (http://www.cssreflex.com/wp-content/uploads/2013/12/simple-grid1.png). The desktop and responsive appearance of our theme are designed to match these parameters to the maximum and initially does not require any in-depth knowledge of CSS.

When the width of the dropdown menu has been changed, this changed our design compliance to the columns grid and in this case, it may be necessary to edit the paddings of neighboring columns using standard Visual Composer options. (https://gyazo.com/75ade17d1ffa0cc58f114f7b2019ae21).

As an example, we have edited some homepage columns to achieve the desired look on desktop devices. (https://gyazo.com/b10b1f51f48b9b874c50ee22afee6599) To reset paddings on mobile devices, please add this code to the tablet and mobile custom CSS area in Theme Settings.

.reset-paddings .vc_column-inner {
	padding-right: 15px !important;
	padding-left: 15px !important;
}

Also, you need to remove this custom code (https://gyazo.com/b7fd617e48670386b9a790713f48cadc). Changing columns grid widths strongly not recommended and may break the appearance of the site and require even more additional code in the future.

Regards

Wow you are so good, my way is too cumbersome.
Your way is short and good.
Thanks, thank you very much.

I only have one more step to complete my homepage, please help me once, how to hide this border to achieve the two sides look connected on a border.

Thanks Bogdan Donovan.

Try to add the following code snippet to the Custom CSS area in Theme Settings to fix this issue.

.categories-menu-dropdown li.menu-item > a {
	position: relative;
}

.categories-menu-dropdown li.menu-item > a:before {
	position: absolute;
	right: -2px;
	top: 0;
	content:"";
	height: 100%;
	width: 5px;
	display: block;
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	-webkit-transform: translate3d(-5px, 0, 0);
	transform: translate3d(-5px, 0, 0);
  -webkit-transition: all .2s ease;
   transition: all .2s ease;
}

.categories-menu-dropdown li.menu-item:hover > a:before {
	background-color: #F9F9F9;
	-webkit-transform: none;
	opacity: 1;
	visibility: visible;
}

.categories-menu-dropdown li.menu-item > .sub-menu-dropdown {
	box-shadow: none;
}

Regards

Excellent, thank you very much. If you are in Vietnam I will invite you to eat.

You are welcome! We also grateful for the invitation.

Thanks, good day.

Thanks, you too!

Hi 2 friends, after the web I have a custom menu, now how to display the submenu (full-width) fit the screen so.
Thank you many of your team.

Hi,

To do this you need to remove some content from this dropdown to make it the same width as your menu list. You can’t simply “cut” it.

Regards

Hi,
So how do you set the mode (full-width)

http://prntscr.com/htv0e1

It will default to frames like this one

Hi,

Full width menu option works only for the main navigation, it doesn’t have the same effect in the side navigation.

Ok, thank you.

You are welcome!

[Author]

Posts