Primary menu template issue

Hi Portgaz,

Please add this code into your custom css file:

#menu-primary li:first-child.current-menu-item {
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	padding-bottom: 12px;
	padding-top: 8px;
}

#menu-primary {
	position: relative;
	padding: 0 2% 1%;
	margin: 0;
	width: 96%;
	height: 2.25em; /* 36px / 16px = 2.25 */
	z-index: 98;
	height: 53px !important;
}

Hello Shinjing,

Thanks a lot for your help.

One last question, do I put this in the WordPress dashboard -> editor -> Style.css of child theme? Is there a specific location to put it, or just at the end of it??

One last question, do I put this in the WordPress dashboard -> editor -> Style.css of child theme?

Absolutely yes.

Is there a specific location to put it, or just at the end of it??

At the end.

Thanks a lot mate!

Hello again guys and thanks for your help so far.

I tried it, but nothing happened…

If this helps, here is how editor->Style.css of live wire child looks like:

/**
 * Theme Name: Live Wire Child
 * Theme URI: https://foxnet.fi
 * Description: A child theme of Live Wire parent theme.
 * Version: 0.1
 * Author: Sami Keijonen
 * Author URI: https://foxnet.fi
 * Tags: post-formats, sticky-post, theme-options, threaded-comments, translation-ready, one-column, two-columns, flexible-width, left-sidebar, right-sidebar, custom-background, featured-images, blue, white
 * License: GNU General Public License v2.0
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 * Template: live-wire
 */

/* Importing the parent theme stylesheet. */
@import url( '../live-wire/style.css' );

/**
* Note: If you want to use media queries in child theme and support them in browsers like IE7 and IE8,
* you should copy and paste parent theme style.css in here and remove line @import url( '../live-wire/style.css' );
* Remember also change all url instances in fonts and backgound like this.
* src: url('../live-wire/fonts/league_gothic-webfont.eot');
* background: url(../live-wire/images/menu-plus.png) no-repeat 0 0;
*************************/

#menu-primary li:first-child.current-menu-item {
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	padding-bottom: 12px;
	padding-top: 8px;
}

#menu-primary {
	position: relative;
	padding: 0 2% 1%;
	margin: 0;
	width: 96%;
	height: 2.25em; /* 36px / 16px = 2.25 */
	z-index: 98;
	height: 53px !important;
}

I am noob in this place and I am just starting to get the grips, so any help would be more than appreciated!

A small update, now I changed it to this (put the code you told me, right after @import):

/**
 * Theme Name: Live Wire Child
 * Theme URI: https://foxnet.fi
 * Description: A child theme of Live Wire parent theme.
 * Version: 0.1
 * Author: Sami Keijonen
 * Author URI: https://foxnet.fi
 * Tags: post-formats, sticky-post, theme-options, threaded-comments, translation-ready, one-column, two-columns, flexible-width, left-sidebar, right-sidebar, custom-background, featured-images, blue, white
 * License: GNU General Public License v2.0
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 * Template: live-wire
 */

/* Importing the parent theme stylesheet. */
@import url( '../live-wire/style.css' );

#menu-primary li:first-child.current-menu-item {
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	padding-bottom: 12px;
	padding-top: 8px;
}

#menu-primary {
	position: relative;
	padding: 0 2% 1%;
	margin: 0;
	width: 96%;
	height: 2.25em; /* 36px / 16px = 2.25 */
	z-index: 98;
	height: 53px !important;
}

/**
* Note: If you want to use media queries in child theme and support them in browsers like IE7 and IE8,
* you should copy and paste parent theme style.css in here and remove line @import url( '../live-wire/style.css' );
* Remember also change all url instances in fonts and backgound like this.
* src: url('../live-wire/fonts/league_gothic-webfont.eot');
* background: url(../live-wire/images/menu-plus.png) no-repeat 0 0;
*************************/

but still there is a flaw as you can see. No doubt, better than before, but I would like it to be exactly as the demo…

Again thanks for your help guys, I really appreciate it!

Have you done some changes in parent theme style.css? If so, install Live Wire again with fresh copy.

No I haven’t… I have done re-installs 2 or 3 times but the problem persists…

I can post the parent theme’s CSS too if it helps…

Then next step is to disable all of your plugins and see if something is messing with the css.

And take of child theme styles also.

I just did it, but the problem persists… This is strange…

Is there any possibility that I may have to change some attributes in css?

“Take of child theme styles also”, you mean using the child’s style.css? If yes, then I am using its style.css

The only problem now seems to be, that when you choose one of the pages in primary menu, the grey highlight doesn’t go till the bottom of the box…

Take this off in child theme style.css

#menu-primary li:first-child.current-menu-item {
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	padding-bottom: 12px;
	padding-top: 8px;
}

#menu-primary {
	position: relative;
	padding: 0 2% 1%;
	margin: 0;
	width: 96%;
	height: 2.25em; /* 36px / 16px = 2.25 */
	z-index: 98;
	height: 53px !important;
}

Wow great, now works like a charm!

Thanks a lot all of you guys! You rock! ??

No problemo.