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.

Nav Links

3 posters

Go down

Solved Nav Links

Post by shawn.m June 7th 2011, 2:35 pm

Hi how can i space out my nav links become at the moment my html page nav links are very close any ideas ? and i want to hide some of my nav links aswell thanks.
shawn.m
shawn.m
Forumember

Male Posts : 365
Reputation : 1
Language : English

http://modifiedcarroom.com/

Back to top Go down

Solved Re: Nav Links

Post by Captain Kuchiki June 7th 2011, 3:16 pm

To hide add this to css
Code:
a[href='/faq'] { display: none; }
just "/faq" with the link of what you want
To add space try this
Captain Kuchiki
Captain Kuchiki
Forumember

Male Posts : 193
Reputation : 34
Language : Serbian, English
Location : In the air

Back to top Go down

Solved Re: Nav Links

Post by shawn.m June 7th 2011, 3:23 pm

All i need to do now is space them out and change the names of the links, can anyone help me ?
shawn.m
shawn.m
Forumember

Male Posts : 365
Reputation : 1
Language : English

http://modifiedcarroom.com/

Back to top Go down

Solved Re: Nav Links

Post by Nera. June 7th 2011, 9:38 pm

Hi,

Add this to CSS.
Code:
.mainmenu {
    padding: 10px;
}
Nera.
Nera.
Energetic

Female Posts : 7078
Reputation : 2017
Language : English
Location : -

Back to top Go down

Solved Re: Nav Links

Post by shawn.m June 8th 2011, 12:29 pm

that dont work there is still a big gap between messages and contact and log out,
shawn.m
shawn.m
Forumember

Male Posts : 365
Reputation : 1
Language : English

http://modifiedcarroom.com/

Back to top Go down

Solved Re: Nav Links

Post by Captain Kuchiki June 8th 2011, 12:34 pm

Did you hide some buttons on that place ? If you are go to Acp > Display > Homepage > Headers & Navigation > and move the buttons that you hide on the top, cause they are taking space even if they are not there
Captain Kuchiki
Captain Kuchiki
Forumember

Male Posts : 193
Reputation : 34
Language : Serbian, English
Location : In the air

Back to top Go down

Solved Re: Nav Links

Post by shawn.m June 8th 2011, 3:12 pm

Thanks now how can i add an image on roll over like this modifiedcars.com they have an orange arrow on rollover ??
shawn.m
shawn.m
Forumember

Male Posts : 365
Reputation : 1
Language : English

http://modifiedcarroom.com/

Back to top Go down

Solved Re: Nav Links

Post by Nera. June 8th 2011, 3:53 pm

Hi,

You can hover your navigations with pictures or change colors of the text on when hovering.

https://help.forumotion.com/t91142-hover-nav-barsrep-asap
Nera.
Nera.
Energetic

Female Posts : 7078
Reputation : 2017
Language : English
Location : -

Back to top Go down

Solved Re: Nav Links

Post by shawn.m June 8th 2011, 4:02 pm

that does not help i dont want only images in the nav bar. I want a small image to be above a link on hover
shawn.m
shawn.m
Forumember

Male Posts : 365
Reputation : 1
Language : English

http://modifiedcarroom.com/

Back to top Go down

Solved Re: Nav Links

Post by Nera. June 8th 2011, 4:04 pm

You can make a transparent background with a small arrow on the top of it and add it as hover below your text navigations.
Nera.
Nera.
Energetic

Female Posts : 7078
Reputation : 2017
Language : English
Location : -

Back to top Go down

Solved Re: Nav Links

Post by shawn.m June 8th 2011, 4:11 pm

ok how can i do this ? Very Happy
shawn.m
shawn.m
Forumember

Male Posts : 365
Reputation : 1
Language : English

http://modifiedcarroom.com/

Back to top Go down

Solved Re: Nav Links

Post by Nera. June 8th 2011, 4:55 pm

Find yours a.menu:hover and replace it with mine. If you don't have it, add it. You can't have two.

Please don't use the same picture Exclamation
It wouldn't be nice to author.

Code:
a.mainmenu:hover {
    background-image: url("http://www.modifiedcars.com/common/arrow-t.png");
    background-position: center top;
    background-repeat: no-repeat;
}

Add what ever you want in this rule to customize it.
I've tired it on your forum, works.
Nera.
Nera.
Energetic

Female Posts : 7078
Reputation : 2017
Language : English
Location : -

Back to top Go down

Solved Re: Nav Links

Post by shawn.m June 8th 2011, 5:38 pm

wow it works thanks alot am goin to make my own on photoshop, One last thing i need to change my nav links style i want them bold and with no hover color
shawn.m
shawn.m
Forumember

Male Posts : 365
Reputation : 1
Language : English

http://modifiedcarroom.com/

Back to top Go down

Solved Re: Nav Links

Post by Nera. June 8th 2011, 5:44 pm

Add this to CSS
Code:
a.mainmenu {
    font-weight: bold;
}

You'll find an other a.mainmenu:hover { with color in it. Remove the color.

a.mainmenu:hover {
color: #ED0000; - remove this
text-decoration: underline;
}
Nera.
Nera.
Energetic

Female Posts : 7078
Reputation : 2017
Language : English
Location : -

Back to top Go down

Solved Re: Nav Links

Post by shawn.m June 8th 2011, 5:50 pm

Ok thanks for all your help! Very Happy
shawn.m
shawn.m
Forumember

Male Posts : 365
Reputation : 1
Language : English

http://modifiedcarroom.com/

Back to top Go down

Solved Re: Nav Links

Post by Nera. June 8th 2011, 5:53 pm

You welcome.

Solved => Locked
Nera.
Nera.
Energetic

Female Posts : 7078
Reputation : 2017
Language : English
Location : -

Back to top Go down

Back to top


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