Jump to content


Photo
- - - - -

Centering The SEARCH In Fixed Nav Bar!


Best Answer Rob , 08 April 2013 - 09:52 PM

Hi, you're almost on the right track.

 

Try this in Dashboard > PageLines > Site Options > Custom Code in CSS Rules with: 

Let us know if this code works for you.

.searchform .searchfield {
    backgroundurl("images/search-btn.png") no-repeat scroll 5px 50% transparent;
    border-radius13px 13px 13px 13px;
    height40px;
    margin-left-800px;
    margin-right550px;
    padding5px 5px 5px 28px;
    transitionall 0.7s ease 0s;
    width250px;
}
Go to the full post


  • Please log in to reply
12 replies to this topic

#1 pspr

pspr

    Super Member

  • Members
  • 114 posts
  • Country: Country Flag

Posted 08 April 2013 - 04:07 PM

Hi guys. So I have a fixed nav bar on my website... Nothing special, the standard one on pagelines. But I want to center the Search text field so its in the center of the nav bar. Help PLEASE



#2 Martin Davies

Martin Davies

    Advocate

  • Members

  • 3268 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 08 April 2013 - 04:25 PM

Can you provide a link to your site please? 



#3 pspr

pspr

    Super Member

  • Members
  • 114 posts
  • Country: Country Flag

Posted 08 April 2013 - 04:46 PM

www.headedforgreatness.com



#4 Martin Davies

Martin Davies

    Advocate

  • Members

  • 3268 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 08 April 2013 - 06:40 PM

centering the nav menu items would require custom CSS. Therefore, I recommend using Firebug or your browsers built-in web dev tools and inspect the nav to find the correct code.
 

For assistance visit our custom CSS documentation - 

Please Login or Register to see this Hidden Content



#5 pspr

pspr

    Super Member

  • Members
  • 114 posts
  • Country: Country Flag

Posted 08 April 2013 - 06:54 PM

Thats exactly what I did.... I used firebug. I messed around with css but i still couldnt get the search item in the nav bar to be centered. It wont go any further to the left......... super frustrating.



#6 Martin Davies

Martin Davies

    Advocate

  • Members

  • 3268 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 08 April 2013 - 06:59 PM

Could you provide some examples of the codes you have tried and we will take a look for you?



#7 pspr

pspr

    Super Member

  • Members
  • 114 posts
  • Country: Country Flag

Posted 08 April 2013 - 07:53 PM

.searchform .searchfield {

margin-left:auto;

margin-right:auto;

}

 

but i know im touching up on the search box because i used the same line to edit the width of the search and it worked.

.searchform .searchfield {

width:250px;

}

 

 

just dont know how to center it on the nav bar...... or even move it manually to the left more.... 



#8 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 08 April 2013 - 09:52 PM   Best Answer

Hi, you're almost on the right track.

 

Try this in Dashboard > PageLines > Site Options > Custom Code in CSS Rules with: 

Let us know if this code works for you.

.searchform .searchfield {
    backgroundurl("images/search-btn.png") no-repeat scroll 5px 50% transparent;
    border-radius13px 13px 13px 13px;
    height40px;
    margin-left-800px;
    margin-right550px;
    padding5px 5px 5px 28px;
    transitionall 0.7s ease 0s;
    width250px;
}


#9 pspr

pspr

    Super Member

  • Members
  • 114 posts
  • Country: Country Flag

Posted 08 April 2013 - 10:23 PM

Thank You Veryyyyyy MUCH!!!!! it works.... I have one last question... Im not sure what I did. But when i go to Dashboard > PageLines > Site Options > Custom Code in CSS Rules and when i try to scroll down with the mouse... it does not work. so the only way I can scroll down in the css is if i click the text in the text box and hold the arrow key to scroll down... this started happening from yesterday.... once i forget and scroll with my mouse it scrolls back to the top again..... was wondering if you guys could help me with this problem..



#10 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 08 April 2013 - 10:39 PM

Unfortunately, I don't know how this could be related to PageLines.  I will say that the CSS Rules area is in essence, a page within a page, which is why you may need to click inside the text area to make it scroll using the mouse.  It could be that before, your volume of CSS was shorter, thus the inset page (where the CSS is) did not have a scroll slide on the right side so you could use the mouse to move up and down. But once that side slide appears, I don't think you can use the mouse the same way.  This is normal with any such page.



#11 pspr

pspr

    Super Member

  • Members
  • 114 posts
  • Country: Country Flag

Posted 08 April 2013 - 10:47 PM

I see. Thanks for everything rob. I was wondering if there was a way I can change the font of the Search inside the nav bar. The font and font size? also i noticed you guys are located in san francisco. Are you guys hiring by any chance. I am a recent graduate from csueb with a degree in Business Administration Emphasis Marketing Management and Finance. I'm trying to get into sales.



#12 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 08 April 2013 - 10:57 PM

The font size is controlled by CSS which can be found using Firebug for Firefox or Chrome's Inspection Tool.  Either of those have a sandbox where you can test changes, and then copy them to place in CSS Rules for implementation.

 

I don't know of any sales or marketing positions open at this time, but feel free to check out our job center

Please Login or Register to see this Hidden Content



#13 pspr

pspr

    Super Member

  • Members
  • 114 posts
  • Country: Country Flag

Posted 08 April 2013 - 11:01 PM

Definitely. Thanks again!