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.

Navigation Bar Trouble

4 posters

Go down

In progress Navigation Bar Trouble

Post by Mutated09 October 16th 2016, 12:33 am

Hello, I'm having problems with my navigation bar. I tried using the code here: https://help.forumotion.com/t91142-hover-nav-barsrep-asap
But when I put it in my CSS page I get a message that says "We have counted a different number of "{" and of "}". It means your CSS risks to be not valid and will not be posted correctly on your forum."

Help please?
Thank you.
Mutated09
Mutated09
New Member

Posts : 22
Reputation : 1
Language : English

http://the-tmnt-lair.forumotion.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Draxion October 16th 2016, 12:51 am

Hi there, can you post your entire CSS code via the
Code:
[code][/code]
Thanks!
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Mutated09 October 16th 2016, 8:15 pm

To clarify, you need the code with the url's already in place?
Mutated09
Mutated09
New Member

Posts : 22
Reputation : 1
Language : English

http://the-tmnt-lair.forumotion.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Draxion October 16th 2016, 8:16 pm

Yes, I need the entire code on your CSS Spreadsheet.
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Mutated09 October 22nd 2016, 11:19 pm

Code:

NAV BAR

#_portal {_mini_index {
background-image: url('http://orig12.deviantart.net/e0b7/f/2016/289/0/3/portal1_by_blueeyedleader-dal85vk.png');
width: XYpx;
height: XYpx;
}
#_portal:hover {_mini_index:hover {
background-image: url('http://orig03.deviantart.net/7f1c/f/2016/289/1/6/portal2_by_blueeyedleader-dal85vg.png');
width: XYpx;
height: XYpx;
}
#_home_index {
background-image: url('http://orig15.deviantart.net/be03/f/2016/289/6/d/home1_by_blueeyedleader-dal85x1.png');
width: XYpx;
height: XYpx;
}
#_home_index:hover {
background-image: url('http://orig06.deviantart.net/9cf0/f/2016/289/4/b/home2_by_blueeyedleader-dal85ww.png');
width: XYpx;
height: XYpx;
}
#_members_index {
background-image: url('http://orig07.deviantart.net/1a62/f/2016/289/b/6/members1_by_blueeyedleader-dal85w8.png');
width: XYpx;
height: XYpx;
}
#_members_index:hover {
background-image: url('http://orig01.deviantart.net/7622/f/2016/289/d/6/members2_by_blueeyedleader-dal85w1.png');
width: XYpx;
height: XYpx;
}
#_groups_index {
background-image: url('http://orig01.deviantart.net/ccb9/f/2016/289/9/3/groups1_by_blueeyedleader-dal85xy.png');
width: XYpx;
height: XYpx;
}
#_groups_index:hover {
background-image: url('http://orig15.deviantart.net/7a5b/f/2016/289/8/3/groups2_by_blueeyedleader-dal85xu.png');
width: XYpx;
height: XYpx;
}
#_search_index {
background-image: url('http://orig10.deviantart.net/cb47/f/2016/289/7/5/search_by_blueeyedleader-dal85v0.png');
width: XYpx;
height: XYpx;
}
#_search_index:hover {
background-image: url('http://orig15.deviantart.net/7a5b/f/2016/289/8/3/groups2_by_blueeyedleader-dal85xu.png');
width: XYpx;
height: XYpx;
}
#_login_index {
background-image: url('http://orig05.deviantart.net/71c4/f/2016/289/5/e/log_in_1_by_blueeyedleader-dal85ws.png');
width: XYpx;
height: XYpx;
}
#_login_index:hover {
background-image: url('http://orig04.deviantart.net/5dd3/f/2016/289/f/8/log_in_2_by_blueeyedleader-dal85wo.png');
width: XYpx;
height: XYpx;
}
 #_logout_index {
background-image: url('http://orig11.deviantart.net/5861/f/2016/289/6/a/log_out_1_by_blueeyedleader-dal85wh.png');
width: XYpx;
height: XYpx;
}
#_logout_index:hover {
background-image: url('http://orig12.deviantart.net/7933/f/2016/289/c/a/log_out_2_by_blueeyedleader-dal85wf.png');
width: XYpx;
height: XYpx;
}
#_register_index {
background-image: url('http://orig00.deviantart.net/2413/f/2016/289/4/0/register1_by_blueeyedleader-dal85va.png');
width: XYpx;
height: XYpx;
}
#_register_index:hover {
background-image: url('http://orig02.deviantart.net/7dcf/f/2016/289/3/4/register2_by_blueeyedleader-dal85v7.png');
width: XYpx;
height: XYpx;
}
Thank you.
Mutated09
Mutated09
New Member

Posts : 22
Reputation : 1
Language : English

http://the-tmnt-lair.forumotion.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by TheCrow October 23rd 2016, 11:14 pm

Mutated09 wrote:
Code:

NAV BAR

#_portal {_mini_index {
background-image: url('http://orig12.deviantart.net/e0b7/f/2016/289/0/3/portal1_by_blueeyedleader-dal85vk.png');
width: XYpx;
height: XYpx;
}
#_portal:hover {_mini_index:hover {
background-image: url('http://orig03.deviantart.net/7f1c/f/2016/289/1/6/portal2_by_blueeyedleader-dal85vg.png');
width: XYpx;
height: XYpx;
}
#_home_index {
background-image: url('http://orig15.deviantart.net/be03/f/2016/289/6/d/home1_by_blueeyedleader-dal85x1.png');
width: XYpx;
height: XYpx;
}
#_home_index:hover {
background-image: url('http://orig06.deviantart.net/9cf0/f/2016/289/4/b/home2_by_blueeyedleader-dal85ww.png');
width: XYpx;
height: XYpx;
}
#_members_index {
background-image: url('http://orig07.deviantart.net/1a62/f/2016/289/b/6/members1_by_blueeyedleader-dal85w8.png');
width: XYpx;
height: XYpx;
}
#_members_index:hover {
background-image: url('http://orig01.deviantart.net/7622/f/2016/289/d/6/members2_by_blueeyedleader-dal85w1.png');
width: XYpx;
height: XYpx;
}
#_groups_index {
background-image: url('http://orig01.deviantart.net/ccb9/f/2016/289/9/3/groups1_by_blueeyedleader-dal85xy.png');
width: XYpx;
height: XYpx;
}
#_groups_index:hover {
background-image: url('http://orig15.deviantart.net/7a5b/f/2016/289/8/3/groups2_by_blueeyedleader-dal85xu.png');
width: XYpx;
height: XYpx;
}
#_search_index {
background-image: url('http://orig10.deviantart.net/cb47/f/2016/289/7/5/search_by_blueeyedleader-dal85v0.png');
width: XYpx;
height: XYpx;
}
#_search_index:hover {
background-image: url('http://orig15.deviantart.net/7a5b/f/2016/289/8/3/groups2_by_blueeyedleader-dal85xu.png');
width: XYpx;
height: XYpx;
}
#_login_index {
background-image: url('http://orig05.deviantart.net/71c4/f/2016/289/5/e/log_in_1_by_blueeyedleader-dal85ws.png');
width: XYpx;
height: XYpx;
}
#_login_index:hover {
background-image: url('http://orig04.deviantart.net/5dd3/f/2016/289/f/8/log_in_2_by_blueeyedleader-dal85wo.png');
width: XYpx;
height: XYpx;
}
 #_logout_index {
background-image: url('http://orig11.deviantart.net/5861/f/2016/289/6/a/log_out_1_by_blueeyedleader-dal85wh.png');
width: XYpx;
height: XYpx;
}
#_logout_index:hover {
background-image: url('http://orig12.deviantart.net/7933/f/2016/289/c/a/log_out_2_by_blueeyedleader-dal85wf.png');
width: XYpx;
height: XYpx;
}
#_register_index {
background-image: url('http://orig00.deviantart.net/2413/f/2016/289/4/0/register1_by_blueeyedleader-dal85va.png');
width: XYpx;
height: XYpx;
}
#_register_index:hover {
background-image: url('http://orig02.deviantart.net/7dcf/f/2016/289/3/4/register2_by_blueeyedleader-dal85v7.png');
width: XYpx;
height: XYpx;
}
Thank you.
Hello @Mutated09,

The problem to the code above is to line 4 as i see the code. In there you have
Code:
#_portal {_mini_index {
which has twice the symbol
Code:
{
. Check the element once more and correct the entire thing with the correct element and one { and you should be fine! Smile


Navigation Bar Trouble Thecro10
Forum of the Forums

Forumotion Rules | Tips & Tricks |
FAQ | Did you forget your password?



*** The Support Forum will never ask you for your email or password, so please do not post them anywhere! ***
No support via PM!
TheCrow
TheCrow
Manager
Manager

Male Posts : 6916
Reputation : 795
Language : Greek, English

https://www.inforumgr.com

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Mutated09 October 31st 2016, 3:08 pm

I changed the code to this but it still isn't working.
Code:

NAV BAR
 
#_portal_index {
background-image: url('http://orig12.deviantart.net/e0b7/f/2016/289/0/3/portal1_by_blueeyedleader-dal85vk.png');
width: XYpx;
height: XYpx;
}
#_portal_index:hover {
background-image: url('http://orig03.deviantart.net/7f1c/f/2016/289/1/6/portal2_by_blueeyedleader-dal85vg.png');
width: XYpx;
height: XYpx;
}
#_home_index {
background-image: url('http://orig15.deviantart.net/be03/f/2016/289/6/d/home1_by_blueeyedleader-dal85x1.png');
width: XYpx;
height: XYpx;
}
#_home_index:hover {
background-image: url('http://orig06.deviantart.net/9cf0/f/2016/289/4/b/home2_by_blueeyedleader-dal85ww.png');
width: XYpx;
height: XYpx;
}
#_members_index {
background-image: url('http://orig07.deviantart.net/1a62/f/2016/289/b/6/members1_by_blueeyedleader-dal85w8.png');
width: XYpx;
height: XYpx;
}
#_members_index:hover {
background-image: url('http://orig01.deviantart.net/7622/f/2016/289/d/6/members2_by_blueeyedleader-dal85w1.png');
width: XYpx;
height: XYpx;
}
#_groups_index {
background-image: url('http://orig01.deviantart.net/ccb9/f/2016/289/9/3/groups1_by_blueeyedleader-dal85xy.png');
width: XYpx;
height: XYpx;
}
#_groups_index:hover {
background-image: url('http://orig15.deviantart.net/7a5b/f/2016/289/8/3/groups2_by_blueeyedleader-dal85xu.png');
width: XYpx;
height: XYpx;
}
#_search_index {
background-image: url('http://orig10.deviantart.net/cb47/f/2016/289/7/5/search_by_blueeyedleader-dal85v0.png');
width: XYpx;
height: XYpx;
}
#_search_index:hover {
background-image: url('http://orig15.deviantart.net/7a5b/f/2016/289/8/3/groups2_by_blueeyedleader-dal85xu.png');
width: XYpx;
height: XYpx;
}
#_login_index {
background-image: url('http://orig05.deviantart.net/71c4/f/2016/289/5/e/log_in_1_by_blueeyedleader-dal85ws.png');
width: XYpx;
height: XYpx;
}
#_login_index:hover {
background-image: url('http://orig04.deviantart.net/5dd3/f/2016/289/f/8/log_in_2_by_blueeyedleader-dal85wo.png');
width: XYpx;
height: XYpx;
}
 #_logout_index {
background-image: url('http://orig11.deviantart.net/5861/f/2016/289/6/a/log_out_1_by_blueeyedleader-dal85wh.png');
width: XYpx;
height: XYpx;
}
#_logout_index:hover {
background-image: url('http://orig12.deviantart.net/7933/f/2016/289/c/a/log_out_2_by_blueeyedleader-dal85wf.png');
width: XYpx;
height: XYpx;
}
#_register_index {
background-image: url('http://orig00.deviantart.net/2413/f/2016/289/4/0/register1_by_blueeyedleader-dal85va.png');
width: XYpx;
height: XYpx;
}
#_register_index:hover {
background-image: url('http://orig02.deviantart.net/7dcf/f/2016/289/3/4/register2_by_blueeyedleader-dal85v7.png');
width: XYpx;
height: XYpx;
}
Mutated09
Mutated09
New Member

Posts : 22
Reputation : 1
Language : English

http://the-tmnt-lair.forumotion.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Draxion October 31st 2016, 3:09 pm

You need to put 'NAV BAR' as a comment, like this...

Code:
/* NAV BAR */
Draxion
Draxion
Helper
Helper

Male Posts : 2518
Reputation : 321
Language : English
Location : USA

https://www.talesoftellene.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Mutated09 November 2nd 2016, 1:00 am

Draxion wrote:You need to put 'NAV BAR' as a comment, like this...

Code:
/* NAV BAR */


Like this? It isn't showing up.
Code:
/* NAV BAR */
#_portal_index {
background-image: url('http://orig12.deviantart.net/e0b7/f/2016/289/0/3/portal1_by_blueeyedleader-dal85vk.png');
width: XYpx;
height: XYpx;
}
#_portal_index:hover {
background-image: url('http://orig03.deviantart.net/7f1c/f/2016/289/1/6/portal2_by_blueeyedleader-dal85vg.png');
width: XYpx;
height: XYpx;
}
#_home_index {
background-image: url('http://orig15.deviantart.net/be03/f/2016/289/6/d/home1_by_blueeyedleader-dal85x1.png');
width: XYpx;
height: XYpx;
}
#_home_index:hover {
background-image: url('http://orig06.deviantart.net/9cf0/f/2016/289/4/b/home2_by_blueeyedleader-dal85ww.png');
width: XYpx;
height: XYpx;
}
#_members_index {
background-image: url('http://orig07.deviantart.net/1a62/f/2016/289/b/6/members1_by_blueeyedleader-dal85w8.png');
width: XYpx;
height: XYpx;
}
#_members_index:hover {
background-image: url('http://orig01.deviantart.net/7622/f/2016/289/d/6/members2_by_blueeyedleader-dal85w1.png');
width: XYpx;
height: XYpx;
}
#_groups_index {
background-image: url('http://orig01.deviantart.net/ccb9/f/2016/289/9/3/groups1_by_blueeyedleader-dal85xy.png');
width: XYpx;
height: XYpx;
}
#_groups_index:hover {
background-image: url('http://orig15.deviantart.net/7a5b/f/2016/289/8/3/groups2_by_blueeyedleader-dal85xu.png');
width: XYpx;
height: XYpx;
}
#_search_index {
background-image: url('http://orig10.deviantart.net/cb47/f/2016/289/7/5/search_by_blueeyedleader-dal85v0.png');
width: XYpx;
height: XYpx;
}
#_search_index:hover {
background-image: url('http://orig15.deviantart.net/7a5b/f/2016/289/8/3/groups2_by_blueeyedleader-dal85xu.png');
width: XYpx;
height: XYpx;
}
#_login_index {
background-image: url('http://orig05.deviantart.net/71c4/f/2016/289/5/e/log_in_1_by_blueeyedleader-dal85ws.png');
width: XYpx;
height: XYpx;
}
#_login_index:hover {
background-image: url('http://orig04.deviantart.net/5dd3/f/2016/289/f/8/log_in_2_by_blueeyedleader-dal85wo.png');
width: XYpx;
height: XYpx;
}
 #_logout_index {
background-image: url('http://orig11.deviantart.net/5861/f/2016/289/6/a/log_out_1_by_blueeyedleader-dal85wh.png');
width: XYpx;
height: XYpx;
}
#_logout_index:hover {
background-image: url('http://orig12.deviantart.net/7933/f/2016/289/c/a/log_out_2_by_blueeyedleader-dal85wf.png');
width: XYpx;
height: XYpx;
}
#_register_index {
background-image: url('http://orig00.deviantart.net/2413/f/2016/289/4/0/register1_by_blueeyedleader-dal85va.png');
width: XYpx;
height: XYpx;
}
#_register_index:hover {
background-image: url('http://orig02.deviantart.net/7dcf/f/2016/289/3/4/register2_by_blueeyedleader-dal85v7.png');
width: XYpx;
height: XYpx;
}
Mutated09
Mutated09
New Member

Posts : 22
Reputation : 1
Language : English

http://the-tmnt-lair.forumotion.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by SLGray November 2nd 2016, 1:49 am

Add it to the top of the CSS stylesheet.


Navigation Bar Trouble Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51608
Reputation : 3529
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Mutated09 November 12th 2016, 12:29 am

It's still not working.
Mutated09
Mutated09
New Member

Posts : 22
Reputation : 1
Language : English

http://the-tmnt-lair.forumotion.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by SLGray November 12th 2016, 2:42 am

Do you exactly have numbers for the heights and widths?


Navigation Bar Trouble Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51608
Reputation : 3529
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Mutated09 November 19th 2016, 2:42 am

This part?
width: XYpx;
height: XYpx;
Mutated09
Mutated09
New Member

Posts : 22
Reputation : 1
Language : English

http://the-tmnt-lair.forumotion.com/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by SLGray November 19th 2016, 2:57 am

Mutated09 wrote:This part?
width: XYpx;
height: XYpx;
Yes


Navigation Bar Trouble Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51608
Reputation : 3529
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

In progress Re: Navigation Bar Trouble

Post by Mutated09 November 21st 2016, 1:33 am

I'm sorry, it still isn't working. Would it be possible for someone to play around with the code to make it work? Or can I add a menu that's already made from the Menu Maker website?

Head
Code:
<!-- Icon Library -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">


HTML
Code:
<div id="cssmenu">
  <ul>
    <li class="active"><a href="http://the-tmnt-lair.forumotion.com/">Home</a></li>
    <li><a href="http://the-tmnt-lair.forumotion.com/portal">Portal</a></li>
    <li><a href="http://the-tmnt-lair.forumotion.com/memberlist">Members</a></li>
    <li><a href="http://the-tmnt-lair.forumotion.com/groups">Groups</a></li>
  </ul>
</div>

CSS
Code:
#cssmenu ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  width: auto;
  position: relative;
  display: block;
  font-size: 14px;
  font-weight: bold;
  background: #4f4646;
  font-family: Arial, Helvetica, sans-serif;
  border-bottom: 1px solid #4f4646;
  zoom: 1;
}
#cssmenu ul:before {
  content: '';
  display: block;
}
#cssmenu ul:after {
  content: '';
  display: table;
  clear: both;
}
#cssmenu li {
  display: block;
  float: left;
  margin: 0;
  padding: 0 4px;
}
#cssmenu li a {
  display: block;
  float: left;
  color: #ffffff;
  text-decoration: none;
  font-weight: bold;
  padding: 10px 20px 7px 20px;
  border-bottom: 3px solid transparent;
}
#cssmenu li a:hover {
  color: #8ab34d;
  border-bottom: 3px solid #8ab34d;
}
#cssmenu li.active a {
  display: inline;
  border-bottom: 3px solid #8ab34d;
  float: left;
  margin: 0;
}
Mutated09
Mutated09
New Member

Posts : 22
Reputation : 1
Language : English

http://the-tmnt-lair.forumotion.com/

Back to top Go down

Back to top

- Similar topics

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