Link to home
Start Free TrialLog in
Avatar of Amanda Watson
Amanda WatsonFlag for Australia

asked on

Does anyone know the css I need to add to make the search icon sit besides the NEWS menu item?

I think I will have to shift the menu to the left a bit for it to sit inline, but I suspect there is more css involved.  Does anyone know the code I need to add to make this inline icon with the menu sitting to the right?
Avatar of Amanda Watson
Amanda Watson
Flag of Australia image

ASKER

http://barefruit.com.au/dev/
Sorry that is the page.

I am also trying to figure out the code to make the header sticky.....the rest of the pages the header is stuck to the top, but the homepage it still scrolls.  What css do I have to add to make it stay put?
ASKER CERTIFIED SOLUTION
Avatar of Pankaj Jangir
Pankaj Jangir
Flag of India image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
And I missed the sticky header.

I can't see any sticky menu in any page.
Avatar of Peter Hart
for the search to stay along the  top and also to stop  theme updates overwriting your changes install a plugin in called "simple custom CSS" from here:
https://en-gb.wordpress.org/plugins/simple-custom-css/

this will allow you to overwrite the styles without messing with the code and when updates for the theme come along it will still hold.

Once installed there is a new option under appearances "simple custom css" , go into that and add the following:

.topmenu_switch #topbar_right
{
    float: right;
    margin-left: 32%;
}

and save it.  the search box will now stay along the top (and work on mobiles)

for the sticky menu I would use a plugin such as:

https://wordpress.org/plugins/sticky-header/

otherwise you will need to go into the code and add stuff , and then you will have to create a child theme to stop it being overwritten when an update comes along.
I have created a child theme so I am happy to add code to the css
So what do I need to do to the homepage to make the header STICK
Thanks Pankja yours worked, but NOT RESPONSIVE so I changed it to
.topmenu_switch #topbar_right {
    right: 10%;
    position: absolute;
}
.topmenu_switch #topbar_menu {
    float: right;
    margin-right: 5%;
}

Thank you
chiltern, yours didn't include the search icon moving responsively either, or didn't work at all, but the first choice worked, but needed responsive coding
Nice help thanks
Glad to help 👍