Your theme has made room for only its own icons. To make more room, try this custom css:
@media only screen and (min-width: 768px) {
#navigation .menus.nav-icons-3 .side-nav {
width:auto;
}
}
Custom css can be entered at:
Dashboard > Appearance > Customise > Additional CSS
That can’t be right. My theme is the same theme by the people who make Woocommerce. This is what it should look like:
http://demo.woothemes.com/?name=canvas&_ga=1.225719065.265724853.1489990196
The four icons are all inside a div of class .side-nav. The width of this div is set to 9em in themes/canvas/style.css at line 3560, but it needs to be 12em or larger to accommodate 4 icons. See it in Chrome tools. The width allocated to this div in the demo’s style sheet is much larger.
Thanks. When I go into change that line it still doesn’t work for me 🙁
Its working here, just try refreshing your browser cache.
I advise not changing the line because that file will be overwritten by theme updates. You have a theme update pending. Best to put the snippet at Additional CSS.
Thank you!
I also realized that when I increased the font size greater than 14 it made the menu incapable of holding the icons within their container. I don’t plan on renewing with Canvas to be able to receive with updates. It’s a yearly subscription. The same cost would get me a theme + the Genesis framework with unlimited updates through Studiopress. In the future that would be better for me. And for everyone who is ever interested going through Woocommerce for themes I’d caution you to strongly think about the yearly fee for updates/support.
