Hi, hope you can help me out:

I'd like the superfish menü to...

1) drop shadow
-> I changed the templates to TRUE but no shadow shows up

2) have less empty space after the name of the Link and right beside the arrow as well
-> Tried to mess around with padding / margin it but did not get it smaller

3) have a space between the menu rows
-> Got a space done between the top and the 1st sub-row but can not get him to make a space between all sub-rows

Can you please help me out on this 3 issues? Would be really appreciated! Thanks!

CommentFileSizeAuthor
#9 original.jpg49.81 KBRomejoe
#9 local.jpg65.48 KBRomejoe
#1 Image1.gif113.76 KBPolk
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Polk’s picture

FileSize
113.76 KB

I'm having Superfish alignment problems, too. If a child is a visited link, then it seems to add extra spacing, making the link items too far apart....I'll attach a screenshot of what I'm talking about.... if you look close, there is extra space after "Human Services". The extra space does not appear until that link has been clicked on and becomes a visited link.

Any ideas?

Thank you!

Leslie

danpros’s picture

Hi All,

I have another project in progress so can't be here all the time :)

Change the code here (style.css)

#superfish {
height:35px; 
float:left;
}

#superfish h2 {
height: 0;
overflow: hidden;
position: absolute;
}

#superfish .menu {
float:left;
height:35px;
}

#superfish .menu a, 
#superfish .menu a:visited  { 
color:#fff;
text-decoration:none;
font-size:12px;
font-weight:bold;
text-transform:uppercase;
padding:11px 29px 11px 29px;
}

#superfish .menu li {
background: transparent;
padding:0 3px 0 0;
}

#superfish .menu li li {
background: #004f90;
left: -1px; 
}

#superfish .menu li li li {
background: #004f90;
top: 0px;
}

#superfish .menu li:hover, 
#superfish .menu li.sfHover,
#superfish .menu a:focus, 
#superfish .menu a:hover, 
#superfish .menu a:active {
z-index:10;
}

#superfish .menu li:hover {
background:transparent url(images/menu-hover-bg.gif) repeat-x;
}

#superfish .menu li.active-trail {
background:transparent url(images/menu-hover-bg.gif) repeat-x;
}

#superfish .menu li.active-trail li {
background: #004f90;
}


#superfish .menu li li:hover {
background: #004f90;
}

#superfish .menu li li li:hover {
background: #004f90;
}

And if needed go to sf -> css folder and change the superfish.css.

Tips: learn from Pixture Reloaded or Sky theme.

Romejoe’s picture

Sorry for bothering you agin but since I do not really understand all this css around superfish, could you please help me or give me a hint?

I found the settings in the superfish.css setting the width and changed them to something that fits my menu items.
But this means: I either have a good looking menu with and if someone enters a larger menu item the width has to be set manually again for the lenght of the new menu item, or I have to set it way bigger as the needed menu "just in case" as it was before what's looking bad.

If I understand the superfish page right, normally the width is dynamically set but one can specify a minimum width. Why is this not done in danland? Can I change this easily back?

And my biggest problem:
I can not get the shadows to work. Can you please help me aout on this one at least?
Why is the shadow not working in Danland? I do not find any reason for it. Is it something in your CSS?
I really like to add shadows because it looks way cooler than without.

danpros’s picture

Hi,

This is how to show the drop shadow after set to true. Add this in superfish.css

/*** shadows for all but IE6 ***/
#superfish .sf-shadow ul {
	background:	url('../images/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
#superfish .sf-shadow ul.sf-shadow-off {
	background: transparent;
}

The rest is CSS.

For other problems it's because Danland using image separator for each menu, change that to match the color. Please learn the superfish.css, the settings is all there (i.e. ul or li width).

Romejoe’s picture

Thank you very much!

Romejoe’s picture

EDIT: After first problems - No Idea why, now it works with your code. The only problem is the shadow is only as high as one menu item and aligned at the top.

I got some time ago a CSS problem with floated CCK fields that had a smaller height as they should because of float. This remembers me on that case. Might it be something similar?

Polk’s picture

Just wanted to let you know that this worked! I actually changed it in the local.css, sf.css and style.css just to be sure.

Thank you so much, Dan; you're awesome!

Leslie

Romejoe’s picture

Which theme version are you using? Did you just add his snipplet at the bottom of all 3 files?
I can`t get mine working correctly, tried to remove my local.css as well to make sure my changes do not cause the problem but nothing.

Romejoe’s picture

FileSize
65.48 KB
49.81 KB

I took some picture (see bottom) so you can see what my problem is:

1. I can not move the UL tag at all even if I can give it border or something. So I moved the LI to what I like the menu to look like (shadow stays in place cause I can not move the UL and you see where the shadow is)

2. The shadow is about the heigt of 1 list entry. It does not matter how many entries exist.

3. I can not see the shadow if I do no changes exept your shadow snipplet. It is hidden behind the menu I found as I moved the LI tag (see pictures attached).

4. Just deleted local.css, suferfish.css, styles.css and copied them new to the webserver from the theme. Only added your snipplet at the bottom of the superfish.css. Just in case I might have changed anything and forgotten. No change!

Any chance to help me? I can not find what the reason is.

I can send you the URL of the site if you want to have a look with firefly or such. I'd like to send by PM if needed.

danpros’s picture

Hi Gork,

Yes I know your problems is, maybe this is the Danland limitations, at least for now.

I'll try to fixes this in next release and adding new features in it (i.e. new block), I have un-finished project (custom Drupal theme) and the time is running :D

I hope you understand my position here. You can learn from the original superfish first.

Thanks,
Dan

Romejoe’s picture

Thanks Dan,

So I need to live without shadows until than since I not really understand how all the css work together.
Hope you can address this issue in the next release ;=)

danpros’s picture

Hi Gork,

Hope you can address this issue in the next release

Sure I can, a few minutes ago I try to adding it and now it's done! :)

Soon I'll releasing the new version of Danland, I rewrite the CSS for better understanding to end user, adding the superfish menu shadow and maybe adding 3 more blocks (I think under the content bottom regions need 3 equal height column, yes like in preface region).

Next version Danland is walk to version 2.0. Long life for Danland! :D

Dan

Romejoe’s picture

Sounds great!

I had a problem to move the coulms around. I like to have them with some space between the top and the sub-menus back then. If I moved the OL (or was it UL?) it did not move at all. So I moved the LI around but then the background of the OL/UL did not move along (Shadow) neither did I expect it to. But how can I move the UL/OL?
Can you please see to mark the part of the css which one needs to change to be able to move the lists (menus)?

Polk’s picture

That sounds great, Dan, thank you! I still can't get the color of the parent links on the menu to be a different color without it effecting the children colors --- I think they are in the same element, but don't know how to create a new element to separate them so they can appear differently without affecting each other. That would be a great feature to see in the new release!

Leslie

danpros’s picture

Status: Active » Closed (fixed)

Hi,

@Gork @Leslie: I already releasing new version. I'll close this.

Please open another thread if you need more helps.

Thanks,
Dan