- This topic has 10 replies, 2 voices, and was last updated 3 years, 2 months ago by Dominic.
September 8, 2017 at 12:19 pm #381902Dominic
Hello everybody.I just joined today and I really love the Theme.Its so well written/coded.
before I tried Avada. It doesnt even come close to GP.
here is my question:
I want to have a separate search in my navigation. I have found Ajax Search Lite and it worksbest for my sites purpose.
I want to have a streched out search bar from my Logo on the Left to the Home Link.
I implemented the search bar via shortcode.
I can adjust the length via CSS
,but the problem is,the search bar is not flexible on smaller screens and screws the whole navigation.
full-width,max-width etc doesnt work.
the best example how I would like it to look like is amazons search bar.
streched out,adjusts to smaller screens and stays in one row.
Its probably a simple solution but I just started to learn CSS 2 weeks ago.
Thanks in advance.GP Premium 1.4.3September 8, 2017 at 1:35 pm #381941LeoStaffCustomer SupportSeptember 8, 2017 at 3:49 pm #381998Dominic
HereSeptember 8, 2017 at 4:27 pm #382019LeoStaffCustomer SupportSeptember 9, 2017 at 2:29 am #382186Dominic
hi,I experimented a little bit but the problem still the same.
I implemented the search bar below the navigation,didnt change anything and the the searchbar behaves as I would like to. it automatically streches to the full width ,depending on the container size.
I think the problem has something to do with the navigation dimensions/spacing so that the search bar is automatically boxed to a certain size.
I think the CSS would have to be something like max-width or width:100% or auto.
I dont even know if implementing the search bar via shortcode is the best way.I just used it because it worked.September 9, 2017 at 7:53 am #382317LeoStaffCustomer Support
Hmm not sure what you mean?
The search bars below the navigation are inserted using Elementor.
Might be best to contact Ajax Search Lite plugin author and see if they can help you change the width.September 9, 2017 at 12:14 pm #382420Dominic
ok,I’ll try to show it with screenshots.
I just started to learn about CSS and english is not my first language. its hard to articulate myself.
I basically want it to look like this (except top padding). 1 row,the search bar is always covering the rest/left side of the navigation.
it should look like this on a full screen
and like this when the screen is smaller.
please keep in mind: maybe your first suggestion was right but I did something wrong.I can only change small things.I cant code myself and I dont know many basics.September 9, 2017 at 2:03 pm #382453LeoStaffCustomer Support
My way above let you specify a certain width for screen size above 1550px, and then the default style applies for screen width below that.
The coding structure is a bit complicated for that plugin. Have you tried asking their support on how to use CSS to change the width?September 10, 2017 at 3:09 am #382647Dominic
I will ask them in their forum later today or tomorrow. but I still think it has something to do with the Column or Grid (?) Size in the Navigation which limits the search bar in width.
I probably try to create a mega menu because its to complicated for me.
thank you anywaySeptember 10, 2017 at 9:08 am #382787LeoStaffCustomer SupportSeptember 11, 2017 at 4:02 pm #383503Dominic
I just wanted to say your advice was correct.I applied it wrong.I still know to little about CSS.
its not flexible as I want it to be,but it does the job for now.
I will still ask ajax search support and let you know if they help me.
- You must be logged in to reply to this topic.