[Solved] Styling Navigation: Simple - Vertical -> irregular

[HoofArted]

Hello all.

I'm new on forums, but have been experimenting with cmsms for a couple of weeks now and it looks quite nice. However, I ran across a situation I can't seem to figure out.

I'm using CMS ver. 1.10.3 and I liked the Simple Vertical styling of the menus, so I decided to style it in a more minimal fashion.

The problem is that the whole menu is indented to the right. Since the space between text part of the menu and the div border is the same as width of the arrow, I figured there's a part of the CSS controling that and I just didn't figure out what.

Well, the funny thing is that when I added new page, the link in the menu wasn't nudged to the right. Here's a printscreen of the situation:



Basically I would like the entire menu to be positioned left or, to be more precise, I would like to be able to adjust the margin.

I hope it's clear enough what the problem is and what's more important - it's easy to solve.

[Dr.CSS]

Like a lot of problems in this board it really helps if you give a link to the problem site/page as we have no idea what the existing CSS has in it, etc....

[HoofArted]

[deleted post]

[HoofArted]

I am sorry for the previous post, it was a missclick.

I'd just like to say that I figured out that no indent css styling applies only to links with no children, so basically I haven't screwed up anything major in code yet...

[HoofArted]

Ok... so I fixed the positioning problem. However, I still:

a) don't know how to include the separator as on the picture above

b) can't set the active link color to: #8dc63f

c) would like (if it's not to complicated)to set parent/children links so that:

i) When a parent is active, the children are black and regular weight and parent is #8dc63f.

ii) When one of the children is active, I would like only that one children to be set to #8dc63f, parent black and bold and all other links as regular (black, normal weight)


I hope I wrote it clear enough. All the code is on the links I provided before and I'm quite tired... it's 3 am here and I should be heading to bed couple of hours ago, but I've been breaking my head with this menu.

[Dr.CSS]

I would have used the style sheet for this menu and stripped all the image calls out of it as it has a call for parent pages and children pages...

If you want to keep using the one you have, use a border-bottom: 1px dotted #color, then look at the page source for what the parents and children classes are so you can target them...

[HoofArted]

Thank you, I will follow your advice.

One more thing - how would it be possible in the boundaries of existing CSS and .tpl to style the 'current page'? I know how to set that when building a static page, but here I don't wan't to change the .tpl file, so I can only change .CSS.

Of course I am open to hear how to tweak the navigation_simple.tpl to be able to style 'current page' in menu.

[Dr.CSS]

look at the page source for what the parents and children classes are so you can target them...

<li class="menuactive parent"><a class="menuactive parent" href="

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

[HoofArted]

Ok, thank you. Everything clear and working now.