CSS etc.

[bookern]

Hi,

Sorry, no site login as it isn’t live yet but hopefully you might be able to give some pointers – or perhaps I should give up trying to keep/put a search in the Navigation Bar… (If you have a fixed IP address I could whitelist you for access)

I tried the “Replace the default theme search with’ option, which didn’t seem to work for my Divi theme so I edited header.php to include the Ajax Search .php code. That works to a point…

ajax1.jpg shows the Navigation bar
ajax2.jpg shows it with the magnifying glass being clicked
ajax3.jpg shows it with a live search

As you can see the search box should ideally be a few pixels lower & further to the left to keep the X visible
Also, as in ajax3.jpg, the search results are partially obscured because they are behind the top bar

I couldn’t see any options to control either of those things, so not sure if there’s any resolution?

Be great if this could be incorporated into the Navigation Bar… so any input very welcome.

It’s a great plugin by the way!

Thanks, Nigel

[Ernest Marcinko]

Hi Nigel,

I think this is either a simple margin or a vertical alignment issue, however it is impossible to tell without actually looking at it directly. The best option in these cases is to check the surrounding container via the development tools (where the plugin is placed) and adjust it’s alignment accordingly. I suspect the original search had a specific class or a specific structure that applied to it.

You could try either this custom CSS:

.asp_m {
    display: inline-block !important;
    vertical-align: middle !important;
}

..or something like this:

.asp_m {
    margin-top: 12px !important;
}

Although I have no idea if these will work.

[Author]

Posts