Changing the menu width using a child theme

Hey there Chironx,

Hope you’re well today ??

I’m not really sure what you’re trying to do but I’m pretty sure you can do that with CSS instead.

Can you please post link to your site and possibly a screenshot of what you’d want to do and I’ll be happy to help ??

Cheers,
Bojan

Hi Bojan,

The site not published yet but can be viewed at

https://new.keenaskitchen.org/

Line 96 of header.php is originally <div class=”top-nav-menu span10″> so I have changed it to span=12 else the menu items wrap after “How it Works” and the menu then has 2 lines. I am running a child theme and just wondered if there was a way to achieve this from the child copy of style.css rather than changing the theme files.

Thanks,
Colin

Hey again Colin,

Thanks for the link and for clarification. You can achieve the same effect with just using CSS as I mentioned above.

Please revert the changes in header.php and make the menu span10 again. When done you can simply add the following to the bottom of your child theme style.css:

.top-nav-menu.span10 {
    width: 100%;
}

It should look like this https://screencast.com/t/ieAYKLmZgHr.

For your information you can also simply copy header.php to your child theme and make what ever changes you want, this file will be used instead of the original theme header.php if that makes sense.

Hope this helps and have a great day ??

Cheers,
Bojan

Hi Bojan,

I tried changing the header.php file back to “span10” again and adding the code to my child theme style.css but the behaviour reverted to wrapping the menu again.

I also tried copying header.php to the child theme folder and modifying it but then the header was corrupted and an error message would be displayed overlapping the header.

I have screen shots to show you but don’t know how to post them here.

Thanks,
Colin

p.s. the page is now at keenaskitchen.org

Hey Colin,

Not really sure what happened there. You can use apps such as Jing which allows you to upload screenshots directly to screencast.com.

It’s possible that the CSS code was just overridden, what we can do is make the changes to span 10 again and add the CSS I provided above, when you do please let me know so I can check your site again.

Cheers,
Bojan

Hi Bojan,

Unfortunately now the site is live I can’t make the changes (well I could but the owner would be upset). It’s ok, I will work on my local copy of the site and see if I can work it out from here.

Thanks,
Colin

Hey Colin,

Fair enough, please let me know if you run into any issues with it ??

Cheers,
Bojan