Joomla Templates Club 406,261 posts

[rapid Friend rapidJoin date: November 2006Posts: 50Downloads:0Uploads:5 Thanks: 11]

#128490

Hi,
I have an issue with creating a menu item and the icon (bullit) that displays.
As per attached pic, the icon aligns itself with the bottom text if it wraps rather than at the beginning of the title. Can someone advise on how to solve this issue?

Thanks!

---

Attachments:

1. 

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#248912

It’s best if you send link of your site . I will check it for you.

1 user says Thank You to Sherlock for this useful post

1. rapid

[rapid Friend rapidJoin date: November 2006Posts: 50Downloads:0Uploads:5 Thanks: 11]

#248975

Thanks hainn84 – PM’d you the link.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#249042

Hi rapid !
You Open template_css.css in templates/ja_wistery_artistic/css folder , find code section at about line 952 :


a.mainlevel:hover, a.mainlevel:active, a.mainlevel:focus {
background:#F4F4F4 url(../images/a-mainlevel-bg.gif) no-repeat scroll left bottom;
color:#A88624;
text-decoration:none;
}


change into :


a.mainlevel:hover, a.mainlevel:active, a.mainlevel:focus {
background:#F4F4F4 url(../images/a-mainlevel-bg.gif) no-repeat scroll left top;
color:#A88624;
text-decoration:none;
}


[rapid Friend rapidJoin date: November 2006Posts: 50Downloads:0Uploads:5 Thanks: 11]

#249049

Thanks…
I’ve tried applying the solution to the area you suggested but then had problems with the roll over and the icon still remained on the bottom. I also experimented with the code below with mixed results but all had the icon remain on the bottom:

/* Default Joomla! Menu – sub main menu text */
a.mainlevel {
padding: 5px 3px 7px 12px;
width: 90%;
display: block;
background: url(../images/a-mainlevel-bg.gif) no-repeat bottom left;
color: #012F60;
text-decoration: none;
}

a.mainlevel:hover,
a.mainlevel:active,
a.mainlevel:focus {
color: #A88624;
text-decoration: none;
background: url(../images/a-mainlevel-bg.gif) no-repeat bottom left #F4F4F4;
}
/* sub main menu text and active color */
a.mainlevel#active_menu {
color: #A88624;
background: url(../images/a-mainlevel-bg.gif) no-repeat bottom left #F4F4F4;
font-weight: bold;
text-decoration: none;

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#249058

Hi rapid !
icon still remained in bottom can bacause height of it, it very height , i think that you must edit icon image, You can send FTP account via pm , i will edit it for you !

[rapid Friend rapidJoin date: November 2006Posts: 50Downloads:0Uploads:5 Thanks: 11]

#249867

Hey hainn84,
Have you had a chance to look at this??? I PM’d the FTP details back on the 14th may.

Thanks.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#249957

Hi rapid !
Sorry, sorry for missing , But now , i have view your : server not found , please check it !

[rapid Friend rapidJoin date: November 2006Posts: 50Downloads:0Uploads:5 Thanks: 11]

#249968

I’ve PM’d the link to you – thanks.

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#249978

Hi rapid !
Please check again .Icon is ok now , following is css code you use for it :


/* Default Joomla! Menu - sub main menu text */
a.mainlevel {
padding: 5px 3px 7px 12px;
width: 90%;
display: block;
background: url(../images/a-mainlevel-bg.gif) no-repeat 0px 8px;
color: #012F60;
text-decoration: none;
}

a.mainlevel:hover,
a.mainlevel:active,
a.mainlevel:focus {
color: #A88624;
text-decoration: none;
background: url(../images/a-mainlevel-bg.gif) no-repeat 0px 8px #F4F4F4;
}
/* sub main menu text and active color */
a.mainlevel#active_menu {
color: #A88624;
background: url(../images/a-mainlevel-bg.gif) no-repeat 0px 8px #F4F4F4;
font-weight: bold;
text-decoration: none;
}


1 user says Thank You to Sherlock for this useful post

1. rapid

[rapid Friend rapidJoin date: November 2006Posts: 50Downloads:0Uploads:5 Thanks: 11]

#249986

Thanks hainn84,
Only now it has created one small problem. The divider between the menu items is overlaying the text wrap.
This is in both IE & FF, can you advise a fix please.

[rapid Friend rapidJoin date: November 2006Posts: 50Downloads:0Uploads:5 Thanks: 11]

#249990

Many Thanks.
However I can now see another small issue. The menu divider is overlaying the text wrap – have a look athe the site and you’ll see what I mean – problem is in both IE & FF.

Also I added some text in bullet point but the graphic isnt showing at the start of the point, any ideas on what could be stopping it from showing?
Look at the home page about 1/2 way down:

“Are committed to our clients
Responsive to their needs; and
Achieve Results
“

Cheers!

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#250083

Please check http://122.201.85.96/~fclaw/
All issue is ok now ! I have edit background image and css for it !

1 user says Thank You to Sherlock for this useful post

1. rapid

[rapid Friend rapidJoin date: November 2006Posts: 50Downloads:0Uploads:5 Thanks: 11]

#250087

Sensational service as usual – thank you!

Did you have a chance to look at the other issue re bullet points mentioned in my last post (see below)?

…Also I added some text in bullet point but the graphic isnt showing at the start of the point, any ideas on what could be stopping it from showing?
Look at the home page about 1/2 way down:

“
Are committed to our clients
Responsive to their needs; and
Achieve Results
“

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#250090

Hi rapid !
Please send screen shot , I don’t show this issue ! 😉

[Author]

Posts