9 replies to this topic

[LukeB]

I’m going to use the custom menu widget in the content sidebar and locate the sidebar just above my content. However I need the menu items to be listed in a single horizontal line. I was just wondering what CSS would be best to use?

 

.widget ul li {

    float: left;

}

 

or

 

.widget ul li {

    display: inline;

}

 

Here’s a link to my site and the page I’m using this menu on.

Please Login or Register to see this Hidden Content

 

Any advice would be much appreciated.

[catrina]

The second code would be best.

[LukeB]

Thanks for the reply.

 

As I’m going to be using a number of different menus i need to be able to target one particular menu and i was wondering which class I could use? I’m using firebug to find the correct one and using the customize plugin but I’m not having any luck.

 

Obviously .widget ul li will change widgets contained within the sidebar area but i need to locate the specific widget menus I’ll be using within the sidebars

 

Ive tried .menu-about-menu-container but that didn’t affect it.

 

Please Login or Register to see this Hidden Content

[Danny]

Hi,

 

I don't see any menus in your sidebar, have you disabled the widget ?

[LukeB]

Hi sorry I dont think i explained it as well as i could have. Im basically using the Universal Sidebar above the content and then using the Custom Menu widget within this sidebar. So the menu im looking to edit on the About page (

Please Login or Register to see this Hidden Content

) is the menu above the content that contains: Editorial Team, Contribute to DYC and Submissions. Its currenlty displayed in a vertical list but i would like to edit this, ill be using different custom menus on different pages so I need a way to edit them on an individual basis.

 

Is there an easier way to set a secondary navigation? I know its possible do set Secondary Nav on pages however I would also need a way to set a Secondary Nav on category pages and Single Post pages.

 

Structure Example

 

Parent Page (Main Nav)

- Child Page (Secondary Nav)

- Child Page (Secondary Nav)

- Child Page (Secondary Nav)

 

Parent Category (Main Nav)

- Child Category (Secondary Nav)

- Child Category (Secondary Nav)

- Child Category (Secondary Nav)

[Danny]

If you inspect your menu, you will notice that each of the menu items is given a unique class. For example, the Editorial Team has the following class:

 

menu-item-7784

 

So you can use this to style the menu items.

 

Example

 

Please Login or Register to see this Hidden Content

[LukeB]

Thanks, using the id's ive managed to achieve the layout i need with the menu items in a horizontal line.

 

Im using the following css

 

.menu-item-7784 {
float: left;
}

.menu-item-7785 {
float: left;
}

.menu-item-7783 {
float: left;
}

 

 

but I was wondering if i could just combine it to something like this

 

.menu-item-7784 .menu-item-7785 .menu-item-7783 {

float: left;

}

 

Ive tried various combinations but the only CSS i can get to work is the first set of code where they are not combined.

[batman]

Hi

Please you can try with

 

Please Login or Register to see this Hidden Content

[Danny]

Use the class instead of the ID, as ID can over power everything else. Also Batman's suggested code above should work.

 

I recommend if you need further assistance with CSS, you visit the W3 Schools website - 

Please Login or Register to see this Hidden Content

[LukeB]

Brilliant thanks, I had missed out the commas which is why it didnt work i guess,

 

Thanks for the help