Search bar covered

Store Design
,
1

Hi, when using my searchbar, the search results are covered by the header. Can anyone help me correct it ?
Thank you :slightly_smiling_face:

https://23af13-e4.myshopify.com/

Daniel19901_0-1723479006650.png
Daniel19901_0-1723479006650.png1863×697 190 KB

2 Likes
2

Hello @Daniel19901 ,

Follow these steps:

  1. Go to Online Store → Theme → Edit code

  2. Open your base.css file and paste the following code at the bottom:

.hdt-header-col-search .hdt_predictive-search2 .hdt-cart-show-has-results { 
    z-index: 999 !important;
}

Thanks

3

Hi @Daniel19901 ,

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above tag:

Here is result:

BSSCommerceHDL_0-1723479213575.png
BSSCommerceHDL_0-1723479213575.png1903×603 186 KB

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you :heart_eyes:

4

Hello @Daniel19901

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.hdt-header-col-search .hdt_predictive-search2 .hdt-cart-show-has-results{ z-index: 999 !important; }

niraj_patel_0-1723479330514.png
niraj_patel_0-1723479330514.png722×262 36 KB

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

5 
.hdt-cart-show-has-results {
    z-index: 9999 !important;
}

Can you add this code to last line file base.css @Daniel19901

BSSTekLabs_0-1723479739725.png
BSSTekLabs_0-1723479739725.png801×721 272 KB

  • Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.