Creating a 2 x 2menu

  • Hi to all helpers,

    I’d like to divide my header in three columns. In the middle there will be a logo, to the left and the right I’d like to show a menu with 2 x 2 items.
    Any hints how I can reach that result, please?
    Should look like this:
    ————————————————————–

    menu1 menu3 LOGO menu5 menu7
    menu2 menu4 slogan menu6 menu8

    ————————————————————–

    Thank you!

    Florian

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

  • From a coding perspective, you can do all this in CSS by adjusting the widths of the menu/Logo/list items, a la:

    menu {
    width: 33%;
    }
    LOGO {
    width: 33%;
    }
    li {
    width: 50%;
    )

    What theme are you working with?

    Thread Starter thaflo

    (@thaflo)

    Hi Christy,

    I’m on to create my own theme. Dividing the header in three column for me is the lower problem; I’m missing an idea how to get a menu with two columns and two rows …
    btw, thank you for your help.

    You can do this by playing with the width of the list items. “li” is CSS for list item. If each list item has a width of 50% of its parent element (in this case, the full menu), your 2×2 effect can be achieved. Also, be sure to set the height so they aren’t different.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Creating a 2 x 2menu’ is closed to new replies.