Log In · Register

 
 
Closed TopicStart new topic
MAKING THE NAVIGATION BAR THINNER/SKINNY, is there any way to do this? i really need this code, PLEASE HELP!
adriannestump
post Mar 26 2009, 03:55 PM
Post #1


Member
**

Group: Member
Posts: 20
Joined: Jan 2007
Member No: 491,870



yeah, self explanitory.
i need a skinny navigation bar,
and it would be SO appreciated if anyone had the code to do this.
 
adriannestump
post Mar 26 2009, 03:59 PM
Post #2


Member
**

Group: Member
Posts: 20
Joined: Jan 2007
Member No: 491,870



Profile 1.0,
and I mean making it skinny in height.
 
adriannestump
post Mar 26 2009, 04:43 PM
Post #3


Member
**

Group: Member
Posts: 20
Joined: Jan 2007
Member No: 491,870



Ok, I'll try that.
Thanks so much for your help :]
 
fixtatik
post Mar 26 2009, 04:54 PM
Post #4


Senior Member
******

Group: Member
Posts: 1,237
Joined: May 2008
Member No: 648,123



it's a little un-standardized, but hey, it's myspace (remember to put it between your <style> tags):
CODE
.rail { display:none!important; }
.clearfix div ul, .clearfix div ul li, .clearfix div ul li a  { height:15px!important; line-height:15px!important; }
.clearfix .clearfix div ul, .clearfix .clearfix div ul li, .clearfix .clearfix div ul li a { height:auto!important; line-height:auto!important; }
table { margin:-14px auto 0!important; }
table table, div table { margin:auto!important; }

it's not perfect; there are a couple issues with this you should know about. first, the navigation itself doesn't have a class, only an ID. therefore, it's impossible to change the height of the navigation easily without also changing the height of the div that contains the advertisement and the div that contains the logo and search bar.

to fix that problem, one can change the height and line-height of unordered lists, their items and links (which is the navigation), and simply move the profile table up a bit to cover left over space. this code will only work efficiently if your profile (your default picture, contact table, about me, etc.) have a background around the entire table. it's a bit hard to explain, but you'll notice what i mean if you don't have that background.

a bit on editing the code:
1. what i gave you is 15 pixels high. you can change it to any height you want by adjusting { height:15px!important; line-height:15px!important; } and { margin:-14px auto 0!important; }.
2. the 15px is the height you want your navigation bar to be. if you want your navigation bar to be 5 pixels, change height and line-height to 5px. if you want it to be 40 pixels, change them to 40px. easy enough.
3. the -14px part is the height of your new navigation minus the height of the original navigation bar (29px). for example, if you chose 5px for the height, the margin you'd need to change would be -24px. if you chose 40px for the height, the margin would be 11px.

unfortunately, in doing all of this the background to the drop-down links disappears. why it happens, i haven't a clue (didn't bother looking in to it, really). you can change the background to white if you need to (.clearfix ul li { backgroud:rgb(255,255,255)!important; }) but that will also change the background of the links that don't drop down (so you'll have annoying rectangles of white on a blue background).
 
Mickey
post Mar 27 2009, 06:10 AM
Post #5


Treasure Pleasure
********

Group: Head Staff
Posts: 11,193
Joined: Oct 2005
Member No: 281,127



Topic closed & moved.
 

Closed TopicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members: