Move search widget on top of page on small screen

Travelify
1

Dear members of the support forum,

On a small screen, the sidebar moves to the bottom, which makes perfect sense.

My wish is to keep the search widget on top of the page, followed bij the main content area, followed by the rest of the sidebar widgets.

I am not familiar with PHP. Is there any way to accomplish this?

My website is www.playtoday.nl

Any help will be much appreciated!

Best regards,
Maarten

2

Hi Maarten,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Travelify Other Options

@media only screen and (max-width: 767px){
    #secondary .widget_search {
    position: absolute;
    top: 4px;
    left: 5%;
    width: 84%;
}
    div#main{
        position: relative;
        padding-top: 100px;
    }
}

Best Regards,
Movin

3

Hello Movin,

Thank you so much and sorry for not replying earlier.

It worked great!! I didn’t think it could be done using CSS because I wasn’t able to find a separate tag for this individual widget.

Thanks again!

Best regards,
Maarten

4

You are most welcome here :slight_smile: