Download & Extend

Adding more than 5 tabs at the top menu

Project:BlueMasters
Version:7.x-1.2
Component:Code
Category:support request
Priority:major
Assigned:gtsopour
Status:needs review
Issue tags:bluemasters, Bluemasters theme, navigation menu

Issue Summary

Hello,

When adding more than 5 tabs at the very top navigation menu, it will wrap under, I was just wondering if anyone can help point me to the CSS file or line of code that needed to be edited in order to expand that area to allow more than 5 tabs.

Thank you for your time.

Comments

#1

Hi,
Take a backup of the style.css file. And modify the code in stye.css file as given below to get more than 5 tabs in one line:
1. line no - 77

#navigation {
display:block;
float:right;
margin:10px 0 0 10px;
overflow:hidden;
width:650px;
}

2. line no- 73

#logo {
float:left;
margin:0;
text-align:left;
width:285px;
}

3. line no-270

#navigation li a {
padding: 5px 15px;
text-decoration: none;
display:block;
color:#7A8090;
font-size:160%;
font-size:18px;
font-weight:bold;
/* width:93px;*/
height:32px;
text-align:center;
}

Please clear cached data.

HTH !!

Rgrds,
Deepika Chavan.

#2

Thanks Deepika,

Works like a charm.

#3

Thanks so much, you're a lifesaver!

#4

Category:feature request» support request
Assigned to:Anonymous» gtsopour
Status:active» fixed

#5

#6

Status:fixed» closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

#7

Version:7.x-1.1» 7.x-1.2
Status:closed (fixed)» needs review

Hi,

I have tried this code but under ver 7x-1.2 the css file has changed and once inserting the code into the areas I think it should go it doesn't drop the menus below each other. Can you please review this and advise me of where to insert the code on ver 7x-1.2

Thanks.

AttachmentSize
Screen Shot 2011-09-12 at 12.32.17.png 78.74 KB

#8

Hi,

Use following:

#navigation {
display:block;
float:right;
margin:10px 0 0 10px;
width:650px;
}

In place of:
#navigation {
display:block;
float:right;
margin:10px 0 0 10px;
overflow:hidden;
width:650px;
}

nobody click here