A question regarding 'responsive' design

I want to design my app according to this sample: "
http://demo.vaadin.com/valo-theme/
" . I.e. a menu from the left and the main part from the right. But for my point of view the menu panel is too wide. When i make browser more narrow the menu panel becoming more narrow too. How can i make such “narrowed” menu panel by default even when browser window is maximised?

Let me put a couple of words more regarding my question. in this sample above each menu item has two types or modes of display: single line mode, when item’s icon goes 1st and a text follows it. Used when browser window is widely opened. Two-lines mode when browser window is narrowed. in this mode the icon is located at the 1st line and item’s title is located at the 2nd line. So, how can i make my menu panel ‘work’ in the two-line mode regarfless of browser window width?

Thanks.

It seems i could find out how to implement what i need. Actually this was a play w/ css selectors. In my case i had to make the following:

.v-ui[width-range~="551px-"]
 {
  .valo-menu-item {
    .valo-menu-item-wrap {
      .v-icon {
         display: block;
         /* Add anything u need... */
      }
      .valo-menu-item-caption {
         display: block;
         /* Add anything u need... */
      }
    }
  }
}