Hover Content in Content Modal

Support
#1

Hi
I am trying to put a search option into a content modal. It works except that the search results do not hover above the modal as they should. I have tried everything I can think of.

Here is test page:
http://concordportal.staging.wpengine.com/searchtest/

Click on the burger bar on right side and start typing in some letters.

Thanks

#2

Hi,

You can try adding this in Theme Options > CSS

#ajaxsearchprores2_1, #ajaxsearchprores2_2, div.asp_r.asp_r_2 {
    position: absolute;
    z-index: 999999999;
}

Hope that helps

#3

It worked! Thanks so much.

#4

That worked great, however now I am having an issue with the search bar and results on mobile. It seems to be forcing it to the right on mobile only? Can you take a look please?

http://concordportal.staging.wpengine.com/songwriters/gene-vincent/

Thanks!

#5

Hi,

To fix it, you can add this code in Theme Options > CSS

@media(max-width:767px) {
.hm19.x-modal .x-modal-content-inner {
    padding:0 !important;
}
}

Hope that helps.

#6

perfect!
Thanks

#7

If you need anything else please let us know.

#8

Hi,

I am having trouble getting the search bar to center on desktop. Click on the “Search Songwriters”

http://concordportal.staging.wpengine.com/songwriters/

And on ipad it goes to the right. I have added css to make it look right on mobile. I am sure I screwed something up somewhere…

Thanks

#9

Hi there,

It’s because of your added padding to your model search, it’s currently set as

padding: 2em 2em 15em 2em;

Please remove the left and right padding, it should automatically center since you set a 40em width.

Thanks!

#10

Ahh, yes I tripped over myself there.
Thanks!

#11

You’re welcome! :slight_smile:

#12

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.