Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #7841

    Besides the great look and awesome features, one of the top reasons I decided to go with the BroadScope theme was the megamenu integration. So imagine my surprise when I went to set it up and discovered that it was locked into the very narrow columns necessary for a five column layout–even if I’m using fewer columns than that. Many of my page titles I want linked are so long that they get chopped into three and four lines of text. Therefore, with a few CSS additions to the custom.css file, I was able to create a much wider, two-column megamenu:

    #top .avia_mega div ul li {
    width: 354px;
    padding: 15px;

    #top .avia_mega div ul li li {
    width: 331px;
    float: left;
    clear: both;
    padding: 3px 0 3px 23px;
    margin: 0;

    #top .avia_mega div ul li li li {
    width: 308px;

    #top .avia_mega div ul li li li li {
    width: 285px;

    .avia_mega2 {
    width: 768px;

    One thing to keep in mind about using this code is that it will affect any other megamenus you try to add to your navigation. Therefore, if you later want to add a three- or four- or even five-column megamenu to another spot in your navigation, you’ll have to really juggle all those numbers around.


    Thanks for your contribution. I’m sure this will help some users :)


    No problem. :)

Viewing 3 posts - 1 through 3 (of 3 total)

The topic ‘Overriding Narrow MegaMenu Columns’ is closed to new replies.