Jump to content


Photo
- - - - -

Move Single Navbar Menu Item to Right

navbar float right

Best Answer gayatriom , 13 March 2013 - 11:18 PM

oh wow. got the answer. 

I added this to my custom css:

 

.navbar .navline{width:100%;}
 
and this is what I already had to make that one item float right:
li#menu-item-114{float:right;font-size:18px;color: #225e20;
font-weight:bolder;}
li#menu-item-114 a {float:right}
.navbar .navline li#menu-item-114 a {float: right;}
.navbar .navline li#menu-item-114  {float: right !important;}
 
Yay! Let's close this! 
Go to the full post


  • Please log in to reply
9 replies to this topic

#1 gayatriom

gayatriom

    Advocate

  • Members

  • 559 posts
  • Country: Country Flag

Posted 07 March 2013 - 04:53 PM

Hi. I'd like to move a single nav bar item to the right. 

 

this is what I have:

 

li#menu-item-114{float:right;font-size:18px;color: #225e20;
font-weight:bolder;}
li#menu-item-114 a {float:right}
.navbar .navline li#menu-item-114 a {float: right;}
.navbar .navline li#menu-item-114  {float: right !important;}
 
However, the above isn't working. Any thoughts?
I just want one menu item on the navbar to float right. 
I don't want to use margin as it will mess up in responsive mode. 
 
 


#2 gayatriom

gayatriom

    Advocate

  • Members

  • 559 posts
  • Country: Country Flag

Posted 07 March 2013 - 08:09 PM

any thoughts?



#3 batman

batman

    Bat Learning

  • Members

  • 2217 posts
  • LocationBuenos Aires, Argentina
  • Framework Version:DMS
  • Country: Country Flag

Posted 07 March 2013 - 11:04 PM

Hi gayatriom

 

Can you provide a link to your website please.

:)



#4 gayatriom

gayatriom

    Advocate

  • Members

  • 559 posts
  • Country: Country Flag

Posted 07 March 2013 - 11:07 PM

ceosearch.com



#5 batman

batman

    Bat Learning

  • Members

  • 2217 posts
  • LocationBuenos Aires, Argentina
  • Framework Version:DMS
  • Country: Country Flag

Posted 07 March 2013 - 11:35 PM

Sorry gayatriom, i don´t find the way.

:(

Please wait for a Moderation Team´s reply



#6 gayatriom

gayatriom

    Advocate

  • Members

  • 559 posts
  • Country: Country Flag

Posted 07 March 2013 - 11:38 PM

oh ok. thanks. 



#7 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 08 March 2013 - 12:08 AM

Hi there,

 

Looking at those three items in the top right, each container is flush next to each other. Its the padding inside each tab which is making it look like they are separate. Even if you align the text right, it won't show a change inside the tab as the padding is holding that text in the first button in place. You'd need to remove the right padding inside the first tab to get it to move over. That won't affect the responsive side of things as it will stay inside the container, even though the padding is removed.



#8 gayatriom

gayatriom

    Advocate

  • Members

  • 559 posts
  • Country: Country Flag

Posted 13 March 2013 - 11:16 PM

Hey James. That's not what I mean. 

I want only one nav button to be on the right side of the menu. 

Does this make sense. 

I want to separate it from the rest of the menu, not text align within the menu item. 

Basically it's a phone number so want it on the right: ) 



#9 gayatriom

gayatriom

    Advocate

  • Members

  • 559 posts
  • Country: Country Flag

Posted 13 March 2013 - 11:18 PM   Best Answer

oh wow. got the answer. 

I added this to my custom css:

 

.navbar .navline{width:100%;}
 
and this is what I already had to make that one item float right:
li#menu-item-114{float:right;font-size:18px;color: #225e20;
font-weight:bolder;}
li#menu-item-114 a {float:right}
.navbar .navline li#menu-item-114 a {float: right;}
.navbar .navline li#menu-item-114  {float: right !important;}
 
Yay! Let's close this! 


#10 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 14 March 2013 - 04:07 AM

Hey there, glad you got it sorted. Thanks for posting the answer.







Also tagged with one or more of these keywords: navbar, float, right