First of all, I want to thank the author of the menu codes. Its great.
This topic above, and the link provided was very useful.
For me, I did something like below, to customize the toggle button:
<div class="sm sm-blue" style="width: 100%;">
<a id="menu-button" style="width: 100%;"></a>
</div>
<ul id="main-menu" class="sm sm-blue collapsed">
.
.
.
I added width:100% so that the toggle button is of the same length as the menu.
I also added ‘collapsed’ on the css class for the ul element with id of main-menu, to prevent the blink effect of the menu showing on next page, and then being collapsed (in other words, when a new page is being loaded, the menu is displayed, and then undisplayed. Adding the ‘collapsed’ class makes the menu undisplayed by default).
Thanks again for this great menu.