Wayfinder menu indentation

I have a wayfinder menu on my website http://deepafrica.info/stichtingrespect/modx/index.php?id=5 but I want to reduce the indentation so that the child links appear closer to the parent link(see attached),like where I have placed the red marks.

Kindly assist.

Lillian

All you need to do is adjust your margins/paddings in your CSS for nested list items or the lists themselves.


(Adjust to suit your preference)

Thanks a lot and where exactly do I get the css?

you make one.
just put the css call into your html header.
anyway, you can follow what ryan suggests, or you can read the wayfinder tutorial, about setting the class templates.

Thanks.
I managed but now, my other question is, how do I remove or change the bullets before the menus and how do I center the whole menu.


Many thanks.
Lillian

.classname {
list-style-type: none;
text-align: center;
}

http://www.w3schools.com/css/

thank you all for the replies, it worked.
How do I completely remove the bullets on the menu, and where do edit the css so that I change the link colors?

Quote from: lilian at Sep 15, 2009, 12:59 AM

thank you all for the replies, it worked.
How do I completely remove the bullets on the menu,

Just add "list-style-type: none;" line to all wayfinder’s classnames.

Quote from: lilian at Sep 15, 2009, 12:59 AM

and where do edit the css so that I change the link colors?

If you want the change include all the link colors in the html’s body, you can write for example like this:

I urge you to read all the http://www.w3schools.com/css/ tutorial to know the whole picture.

Anyway, if you’re using the default modx’s template, you must investigate all the CSS-styles that’s been used, so you can avoid making a conflict style to a same classname.
Or a better way, just make a brand new template, with the whole brand new CSS files, under a new folder (usually you can refer to ../assets/templates/myNewTemplate).
I used to gather all the CSS files under a specific CSS folder.