The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

How to remove gap in Navbar and add shadow/hover effect?

4 posters

Go down

How to remove gap in Navbar and add shadow/hover effect? Empty How to remove gap in Navbar and add shadow/hover effect?

Post by middo2 October 5th 2013, 5:54 am

Hi again,

How do I remove the gap that is between Home and Forum?

How to remove gap in Navbar and add shadow/hover effect? Navbar10

Also how could I add a hover effect to the buttons like the one in this forum: http://armedoutlawz.forumotion.com/

Thanks in advanced
middo2
middo2
Forumember

Posts : 503
Reputation : 5
Language : English

http://newhorizons.englishboard.net

Back to top Go down

How to remove gap in Navbar and add shadow/hover effect? Empty Re: How to remove gap in Navbar and add shadow/hover effect?

Post by Mr. Eddster October 5th 2013, 5:58 am

middo2 wrote:Hi again,

How do I remove the gap that is between Home and Forum?

How to remove gap in Navbar and add shadow/hover effect? Navbar10

Also how could I add a hover effect to the buttons like the one in this forum: http://armedoutlawz.forumotion.com/

Thanks in advanced
i can help you with the gap

go to admin panel=> Display=> Homepage=> Header & Navigation
Then below listing all the navlinks, make sure your order from top to bottom is....
Home
Forum
Gallery
FAQ
Members
Profile
Message
Login

HAS to be in that order from top to bottom

i had this problem a ways back, just had to move the nav links around Wink
Mr. Eddster
Mr. Eddster
Forumember

Male Posts : 382
Reputation : 7
Language : English

http://sports-forumbuzz.canadian-forum.com/

Back to top Go down

How to remove gap in Navbar and add shadow/hover effect? Empty Re: How to remove gap in Navbar and add shadow/hover effect?

Post by middo2 October 5th 2013, 6:02 am

Mr. Eddster wrote:
middo2 wrote:Hi again,

How do I remove the gap that is between Home and Forum?

How to remove gap in Navbar and add shadow/hover effect? Navbar10

Also how could I add a hover effect to the buttons like the one in this forum: http://armedoutlawz.forumotion.com/

Thanks in advanced
i can help you with the gap

go to admin panel=> Display=> Homepage=> Header & Navigation
Then below listing all the navlinks, make sure your order from top to bottom is....
Home
Forum
Gallery
FAQ
Members
Profile
Message
Login

HAS to be in that order from top to bottom

i had this problem a ways back, just had to move the nav links around Wink
Unfortunately, it had no affect, The Forum button is now before the Home button, however the gap is still there.
middo2
middo2
Forumember

Posts : 503
Reputation : 5
Language : English

http://newhorizons.englishboard.net

Back to top Go down

How to remove gap in Navbar and add shadow/hover effect? Empty Re: How to remove gap in Navbar and add shadow/hover effect?

Post by Ange Tuteur October 5th 2013, 6:51 am

Hello middo2,

That gap is coming from the image itself, try using this image instead for the home bouton.
Code:
http://i57.servimg.com/u/f57/18/21/41/30/home1210.png
For the opacity effect on hover try the following code in your CSS stylesheet.
Code:
a.mainmenu:hover{
filter:alpha(opacity=80);
opacity:0.8;
}
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

How to remove gap in Navbar and add shadow/hover effect? Empty Re: How to remove gap in Navbar and add shadow/hover effect?

Post by levy October 5th 2013, 12:12 pm

Code:
ul.borderless a[href="/portal"]{
display:none;
}
Add that in your Administration Panel -> Display -> Colors -> CSS Stylesheet
For hover , SethC done for your .
levy
levy
Hyperactive

Male Posts : 2632
Reputation : 350
Language : English, Romanian
Location : Romania

https://portofolio.goodforum.net/

Back to top Go down

How to remove gap in Navbar and add shadow/hover effect? Empty Re: How to remove gap in Navbar and add shadow/hover effect?

Post by middo2 October 6th 2013, 12:29 am

SethC1995 wrote:Hello middo2,

That gap is coming from the image itself, try using this image instead for the home bouton.
Code:
http://i57.servimg.com/u/f57/18/21/41/30/home1210.png
For the opacity effect on hover try the following code in your CSS stylesheet.
Code:
a.mainmenu:hover{
filter:alpha(opacity=80);
opacity:0.8;
}
Thanks a ton Very Happy ! Perfect solution.

A side question...would you happen to know how to make the "Home" button say "Home" and the "Forum" button say "Forum" when I put my cursor over it (in the little description box). i tried doing it via the admin panel, but the boxes with the names are grayed out.

@Candy: Thanks for trying to help :)but the code did nothing observable.
middo2
middo2
Forumember

Posts : 503
Reputation : 5
Language : English

http://newhorizons.englishboard.net

Back to top Go down

How to remove gap in Navbar and add shadow/hover effect? Empty Re: How to remove gap in Navbar and add shadow/hover effect?

Post by Ange Tuteur October 6th 2013, 12:37 am

You're welcome, and no I do not believe I would know how to do that, sorry.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum