I've been having some issues with nav:top See HERE!, and so I think I might be doing things wrong. Is there an easy way to create dividers in the nav:top drop down boxes? I tried inserting horizontal lines and that just screwed everything up….
i just stuck a copy of your nav top in my site for testing just to see what was going on.
Anything that IS NOT a link appears to have a transparent background, hence your problem.
which is probably why the devs made this note
Please do not include anything other than links within the bullet list.
Do not go deeper than 1 level with nesting.
at the bottom of the nav top.
So that answers WHY your problem is occurring. So its not a bug.
As for a possible work round… i shall have a play later.
What you can do is to insert an "autolink" instead of a single "header":
[# empty link] like the Headers of the menu-blocks… but shifted to te right side by one space in the bullet list and enclosed in the span or size tag:
(mention the bullet is one space inside the start…)
* [[size 125%]][# Soma Software][[/size]]
EDIT1. This does not work as expected - the span / size tag inserts a little space line which stops the bullet list at the menu-pull down - hover the mouse over and you have no more chance to get the menu points under such a inserted (sized) autolink line.
Edit2:
A standard autolink works normal …. ( without any size span, or style attributes…)
means - what I would do ( and this works!)
- Gigabit Ethernet Interface
- Software
* [[[hardware:gigabit | Gigabit Ethernet Interface]]]
* Software
* [[size 125%]]Soma Software [[/size]]
* [[[software:Audio Monitor]]]
* [[[software:PyNet | PyNet Event]]]
* [[[software:Recorder]]]
* [[[software:Streams]]]
* [[[software:Synthetic Soma]]]
* [[[software:Tracker]]]
* [[[software:TSpikes]]]
* [[size 125%]] Soma Libraries [[/size]]
* [[[software:libsomanetwork]]]
* More Stuff
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
Hmm… that almost does it… can I just add a tag inside the size tag that sets the background to non-transparent?
Yes, of course, in the size / span tag you can use the style="background-color: white"
typical entry would bem font color=red instead of blue:
* [[span style="font-size:125%; background-color:white; color:red;"]]Soma Software[[/span]]
* Soma Software
EDIT:
==> 1. This works! ( have a look at my test site: http://helmuti-pdorf.wikidot.com/) menu "wikidot pages"
==> 2. but the background is transparent AT THE MOMENT THE TEXT ENDS in the menu-line!
I use too a border on my entries:
* [[span style="font-size:125%; background-color:white; color:red; border: 1px solid silver"]]Soma Software[[/span]]
* Soma Software
Could be I need more knowledge in CSS-style commands
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
Actually it works quite well, except the space between the end of the word and the end of the box has a transparent background….
Can I edit the CSS on the drop down box to NEVER have a transparent background ?
1. I can see you got it!
2. Yes, you need to "customize your theme" in such a way … please have a look on our howto's! or search for "css" in the search center!
There a re a lot of helps for this issue!
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
So I already have a semi-custom theme… I just don't what the css code corresponds to the menu…
Errr… I don't know what group/block/item (don't know what there called) code block to use to set the styles on the nav:top drop down boxes
As I remember - there is an extra part for the nav:top area ( container) existent in the css-themes.
Edit: I am not a CSS-guru - perhaps some other acn helo you with the nav.top blocks…
Edit2: I put "nav top css blocks" in the search bar at the top and got very interesting findings!
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
So I tried customizing the theme by explicitly stating the background color but the drop down box still came out as transparent… :-(
try
#top-bar li ul{background-color: #FFF;color:green}
Phil is on the right track, but you have to get a little deeper into the list items:
/* set drop-down background and text color */
#top-bar ul li.sfhover ul a{
background-color: #ff0000;
color:#00ff00;}
/* set individual menu items background and text color */
#top-bar ul li.sfhover ul li.sfhover a{
background-color: #00ff00;
color:#ff0000;}
I used ugly/extreme color choices to show how it works. You may need to add another pair of these and drop the "a" (anchor) on the end of both for items in your list that don't create links (anchors).
-Ed
This turned out to be a bit more complicated, but after playing some more, I came up with this.
- The code below sets the colors in your drop-down menu for items that are not linked (i.e. your divider items in the list). This allows you to set the color for your divider items differently from the rest of your menu and they will not change color when you hover over them (makes it obvious they are not a link).
#top-bar ul li.sfhover ul li {
background-color: #ff0000;
color:#00ff00;
}
- The code below sets the colors for linked items in your drop-down list when you are not hovering the mouse over them.
#top-bar ul li.sfhover ul a {
background-color: #ff0000;
color:#00ff00;
}
- The code below sets the color of the linked items in your drop-down list while you are hovering the mouse over them.
#top-bar ul li.sfhover ul li.sfhover a {
background-color: #00ff00;
color:#ff0000;
}
Without any changes in the CSS theme you can do an easier way ( Sorry, Phil and Ed!) :
;padding-right:3em ( or 1em, 2 em how long the Block is…) to the right of the inserted bulleted text is "erasing" the background with spaces (and "background-color") …
Have a look on my test site: http://helmuti-pdorf.wikidot.com/pages-without-tags and click on "Wikidot pages"
You will see different "Text-Boxes" in red - with different padding-right length - for a better view I enclosed them in borders…
* [[span style="font-size:125%; background-color:white; color:red; padding-right:1em"]]Soma Software[[/span]]
* [[span style="font-size:125%; background-color:white; color:red; border: 1px solid silver;padding-right:3em"]]Soma Software[[/span]]
in Action:
- Soma Software
- Soma Software
Looks better now and I see no longer ( with the 3em spaces) any background..
Service is my success. My webtips:www.blender.org (Open source), Wikidot-Handbook.
Sie können fragen und mitwirken in der deutschsprachigen » User-Gemeinschaft für WikidotNutzer oder
im deutschen » Wikidot Handbuch ?
Helmuti,
I tried using:
* [[span style="font-size:125%; background-color:white; color:red; padding-right:1em"]]Libraries[[/span]]
and I got this:
The transparency starts when the word ends..

I'll try the other posters advise and then post back…
Ed,
Thanks it worked! It took me a little while to figure out which code block corresponded to which segment of the menu box but it looks like everything is getting rendered correctly now!
Thank you all so much for your help!
I've been playing a bit more with some of the settings and found that you can still have some issues if you fool around with the padding in the list items. When I get it all sorted out so I understand it a bit better, I'll post more details.
I want to thank you for your idea to have unlinked dividers in the menu! I like that idea to add a little "pizzazz" to our top bar menu items.
-Ed





