i am a beginner with web design, while studying i came across the "holy grail layout" and i was just wondering why is it that the menu is vertically aligned while most modern websites tend to use a horizontally aligned menu.
It could be because, back in 2001 when Rob Chandanais of BlueRobot came up with the pure CSS version of this layout, our monitors were much smaller and resolution wasn't as high. Websites had an infinite amount of vertical space, unless you wanted horizontal scrolling. Therefore you could have a lot more navigational items in the menu. Also, it was arguably a lot easier to add items to the vertical menu.
Things have come a long way since then and I don't think you have to have a vertical menu these days.
The reference to the "holy grail" isn't because of the layout being the best possible design, but because this was a very popular layout that was very difficult to implement using CSS only techniques.
As Wikipedia puts it:
It is commonly desired and implemented, but for many years, the various ways in which it could be implemented with the current technologies all had drawbacks. Because of this, finding an optimal implementation was likened to searching for the elusive Holy Grail.
There are many sites, even today 18 years after the problem was named, that use this sort of layout. A common derivative has a main navigation as part of the header (and footer), with the Menu section on the diagram used for sub-navigation. That style also benefits from the "grail" search to actually implement the design.