johnwmcc

I can’t answer this for you. But I think you would be more likely to get a useful response by starting a new thread – you don’t have the same issue as I did.

John McC

I’ve tried this quickly, and it works fine for the ‘blog’ page:
http://kiidstrust.dyndns.org/index.php/blog/

But it doesn’t have any effect on the page you get to by clicking on the blog entry on the home page, which is (for the first item):
http://kiidstrust.dyndns.org/index.php/mardys-take-on-the-iid/

As I can’t see the webmaster adding similar code for each individual post page, can you suggest any other solution that would automatically apply to all new (and old) posts?

Have I got something wrong with the structure of the site? I’m using the plugin Recent Posts Widget Extended to put the posts into the front page Latest News column.

John McC

So sorry – I should have done that first off.

It’s a temporary url for testing before the site goes live on a permanent host:

http://kiidstrust.dyndns.org/

That’s not a typo – there are two ‘ii’s in kiids – you’ll see why when you see the site.

There’s no menu link to the blog page, but you can get to it by clicking on a post on the front page, or go direct to:

http://kiidstrust.dyndns.org/index.php/blog/

HMMM. I see when I look again at the page you get to from clicking on a front page post that it isn’t the same page. That is (from the first front-page posting):

http://kiidstrust.dyndns.org/index.php/mardys-take-on-the-iid/

But they both have the same problem. And I would like to fix both.

John McC

Brilliant – thank you so much. That’s fixed it. I moved the menu settings in the Child theme to apply only to screen width over 1025px, like this:

/* Move main menu bar container but only for desktop width browser*/
@media screen and (min-width:1025px) {

  #primary-navigation {
	position: relative;
	top:-7em;
	left: 40em;
  }
}

It might need a little refinement after testing on other mobiles, but it works on both my iPad and my mobile phone. The content has expanded to the full mobile screen width, and the three-line menu button is now visible top right as desired.

It works as originally intended on the desktop.

Thanks very much indeed.

How did you know that this was the cause?

John McC

Thanks again. I have’t time just at the moment to look, but hope to do so out of curiosity soon.

John

Thank you so much for such a prompt and helpful reply.

The (very much new, incomplete, and evolving temporary) site url is http://kiidstrust.dyndns.org.

I’ve tried using the Chrome Web Developer tools equivalent of Firebug to see what class or id to use to style the menu elements, but get somewhat confusing results.

For example, the first submenu element (Hygiene) of Projects shows
#menu-item-39.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-39 when I select ‘Display ID and Class information’. I can see this is an id reference, and a very long one. And it only refers to one sub-menu element, so wouldn’t be a candidate for styling via CSS, as I’d want to refer to all sub-menu items in one go.

If I choose instead to ‘Display Element Information’ and choose the same item, I get Ancestors:

nav#primary-navigation.site-navigation.primary-navigation
div.menu-main-container
ul#menu-main.nav-menu
li#menu-item-27.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-has-children.menu-item-27
ul.sub-menu
li#menu-item-39.menu-item.menu-item-type-post_type.menu-item-object-page.menu-item-39

which suggests that CSS referring to either ul#menu-main.nav-menu or more likely ul.sub-menu might be the place to modify the appearance.

But I can’t find any reference in the theme’s own style.css file to either of these. So where is the plain orange background (that I want to get rid of) for these elements coming from?

Should I just add such an entry in my Child theme style.css?

Thanks again if you can help further.

John McC

PS. Just tried setting this in the child theme CSS style.css file

ul.sub-menu {
	background-color:#00FF00; /* a vicious green, to show up */
}

but it makes no difference.