How to make this type of navbar?

Go down

In progress How to make this type of navbar?

Post by Royal Bengal on February 9th 2016, 9:16 am

How to make simple navbar as like forumotion support forum? I want to make simple navbar like this forum of forums. For example, Home, Faq, Search etc. Please guide me about it
avatar
Royal Bengal
Forumember

Male Posts : 492
Reputation : 4
Language : English
Location : Bangladesh

http://Avacs.sforum.biz

Back to top Go down

In progress Re: How to make this type of navbar?

Post by Ange Tuteur on February 9th 2016, 9:40 am

Hey,

You can find your answer in this topic.
avatar
Ange Tuteur
Forumaster

Male Posts : 13202
Reputation : 2917
Language : EN10, FR5, JA5
Location : Macungie, PA

https://github.com/SethClydesdale

Back to top Go down

In progress Re: How to make this type of navbar?

Post by Bigtuber on February 9th 2016, 1:32 pm

@Ange Tuteur wrote:Hey,

You can find your answer in this topic.

Hello,

this code is for phpbb3.
Could you tell us the same code for phpbb2? Smile
avatar
Bigtuber
Forumember

Male Posts : 350
Reputation : 19
Language : German, English
Location : Germany

http://kingsroadforum.forumieren.com/

Back to top Go down

In progress Re: How to make this type of navbar?

Post by Royal Bengal on February 9th 2016, 7:58 pm

@Ange Tuteur wrote:Hey,

You can find your answer in this topic.

Hello,

Can you share me the code for phpbb3 here please? I cant understand the topic properly. So if possible share me the code for phpbb3 here,

Thanks
avatar
Royal Bengal
Forumember

Male Posts : 492
Reputation : 4
Language : English
Location : Bangladesh

http://Avacs.sforum.biz

Back to top Go down

In progress Re: How to make this type of navbar?

Post by Ange Tuteur on February 10th 2016, 6:21 am

@Ange Tuteur wrote:phpbb3 is purfect.

Here add these rules to your stylesheet :
Code:
#page-header .navbar { background:none }
#page-header .navbar .linklist li { font-size:0 }
#page-header .navbar .linklist {
  background:#EEE;
  border:none;
  margin:-9px -10px 0px -10px;
}

#page-header a.mainmenu {
  color:#666;
  font-size:13px;
  font-weight:bold;
  font-family:"Trebuchet MS", Arial, Verdana, Sans-serif;
  background:url('http://i21.servimg.com/u/f21/18/21/41/30/nav10.png') repeat-x 0px 45px;
  display:inline-block;
  height:45px;
  line-height:45px;
  padding:0px 12px;
  transition:250ms;
}

#page-header a.mainmenu:hover { background-position:0 40px }

FYI the border is made using a small background image. To change the color you need to to edit the image.
avatar
Ange Tuteur
Forumaster

Male Posts : 13202
Reputation : 2917
Language : EN10, FR5, JA5
Location : Macungie, PA

https://github.com/SethClydesdale

Back to top Go down

Back to top


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