Link to home
Start Free TrialLog in
Avatar of morten444
morten444

asked on

Superfish menu background in Joomla

Hi
I am creating a website: http://new.adpp-mozambique.org/
As you can see i am using superfish menu.
To the right of the menu i have a white field that i want red
The superfish is in a module location called "user3"

Below i have a banner in module location called "banner1"

I can see that they are both using the art-nostyle div

If i in css file create a div called art-nostyle and make background red, it works, but then the background in the banner when the picture change (when clicking a link) also get red

What I want to acheve is that the "user3" and "banner1" are not charing the "art-nostyle"
How do I acheve to fill the white space to the right of the superfish menu without changing the background to red also in the "banner1" place holder?

Kind Regards
Morten

Avatar of darren-w-
darren-w-
Flag of United Kingdom of Great Britain and Northern Ireland image

#alsfh_19_686{
background-color:red;
}
Avatar of morten444
morten444

ASKER

Hi
Thanks for your reply
I am using firefox and i can when using firebug see that #alsfh_19_686 exist
I added the red background in firebug and it works

Now when I go to my website to find this line i cant find it in template.css or the index.php
In firefox it says its in new.adpp-mozambique.org lane 18, put its not refering to the tempalte.css
Where do I have to insert this settings

Kind Regards
Morten
Add the line to your default stylesheet It may be created by the menu
Hm.
I have added to template.css the following code:

#alsfh_19_686
{
background-color:red;
}

it still does not work.
Is there not a way to hardcore it into the index.php file that the "user3" module holder should be red?
or
a way to make sure that the superfish menu fills 100% of the with of my site?

Have you tried adding a module suffix to the module that contains the flash?
div class=art-nostyle flash>

then you should be able to create a new CSS to apply to that

I think the #alsfh_19_686  tag you are looking for is likely to be in the style sheet of the flash  module you are using...if you look in that module you might find a stylesheet in there and that tag could be there

Hi Snowball77
Thanks for reply
The problem I have is that "user3" and "banner1" appear to usethe same art-nostyle
eaven if i manager to edit the css for the flash, the flash should only change the "banner1" not the "user3" where i have the superfish menu.

If i with Firefox Firebug holding the mouse over "user3" the wite field around the translator module, you can see that it also marks the flash banner area "banner1"
So what ever change i apply to "user3" background, will also be applied to the background of the flash banner while loading new image. This is what i do not want.
I want the changes i make ONLY to apply to "user3" location

Thats why I need to find a way eighter in the template.css file or index.php file to set background colour only for the "user3"

Hope this is understandable

Kind Regards
Morten
I do sort of understand..but I just need to clarify, that adding a module suffix to the module using user3 doesn't allow you to create a new css  #art-nostyle flash{ } (flash is the suffix as an example) to only that position?
Also did you check out the module style sheet to find #alsfh_19_686 ?
Hi
Now i can not find it
in the banner "banner1" i use a flash called mod_novasfh, so based on name i guess this #alsfh must be related to this.
Even if i find it and change the background colour to red, then the site will have the same effect that you now see if you use IE. not firefox.
If you click on an link , when the header is changing picture, the whole background is red. Thats what i dont want.
I need to isolate "user3" in a way. There should be no flash in that location accept for superfish

If you look at the site using "IE"now you see the result of inserting a 30px with red picture into art-nostyle
Ok, so do you know what I think might work...move the menu div inside the header div in index.php

move the div and php tags to reside inside the <div class="art header"> then you should be able to give a background color for the menu

this is getting hard to help you with without actually being able to play with the code and modules etc, but I hope throwing around these ideas might help to solve it
ASKER CERTIFIED SOLUTION
Avatar of Amanda Watson
Amanda Watson
Flag of Australia image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Hi Thanks for your advice
I have copy the content over to a test domain:
http://templates.eadvice.dk/

I have moved the "user3" inside "art-header"
I can now set the background. Well throught :)

I stil have some problem as its very  wide and also menu drops behind the banner.
I wil play alittle more with it and se if i can narrow down the menu field

If not 2nd option is to just get the red background that is working in IE to work in Firefox as well.
Very strange I have that problem. normally its the IE that gives me problems

hmm
It looks like I opened up a new set of problems..in regards to the FF and IE issue, I would suggest opening a new question for this to get a fresh set of eyes on the problem that causes the difference in IE and FF

Back to the original problem of getting a red background perhaps put the menu back where it was, but put a new set of divs around it so you can apply a style to the menu section only

Hi,

I'm not so sure if you have found this out yet, but the style #alsfh_19_686 is defined on the page not in a stylesheet.

Darren
Hi
Thanks. I might open a new thead regarding IE og Firefox showing issue

Regarding creating a new div... hm.. I have learned alot during this post but this is to complex for me I think. i tried on http://templates-eadvice.dk but cant seem to figure that out

Regarding the style #alsfh_19_686
I can see that this # also cover the banner area, so what ever I apply to this # will also be applied to the banner. It will look like it now does in IE. red background also behind the flash banner (when clicking any link)

I think i will go for a picture background. Red at the top that fit the menu, and white on the part that falls behind the "banner1", then resolve the issue I have with Firefox and IE in another question.

I keep this open a little bit more in case i get some other idears comming in :)

Thanks so far
I think a solution was found to your original question by moving the menu section outside the div area.

There were other issues that presented themselves which I am sorry we cannot fix, but it would be nice to award points to a possible solution to award the experts that tried to help
Hi. Thanks for all the help. I through only points where given when an issue was resolved, but I am happy to give you the point for trying to help.
Thanks again