В общем как то так:
http://jsfiddle.net/kqhufuqk/2/
только как цифру менять (вместо десяти может быть любая цифра при изменении ширины главного меню) через css я не знаю.

подборка адаптивных меню ...
http://geedmo.github.io/yamm3/
http://352media.github.io/flexMenu/
http://vadikom.github.io/smartmenus/src/demo/
http://www.paitadesign.com/jVanilla/demo/jVanilla.html
http://adnantopal.github.io/slimmenu/
http://codepen.io/artsmc/pen/vghLK
http://manos.malihu.gr/tuts/jquery_c...mple_menu.html

Это значит робот подумает "а зачем два раза одинаковые ссылки, спам что ли?"

я забыл удалить у .button-menu background-image с ссылкой.

Нет, там же два блока с одинаковыми ссылками будет. Сейчас их нет, а на практике придется повторить два раза. Робот конечно разберется, это обычное дело что ссылки постят по два-три раза, скажем в хедере и на всякий случай в футере.