Archived topic

Navigation search / search-form / border color

5 replies · Started by Jan on March 21, 2021

Viewing posts 1–6 of 6

March 21, 2021 at 1:56 pm #1704305

Hi David,

I activated the site search in the Customizer and then went into Color / Primary Navigation / Navigation Search to adjust the text color as well as the background color of the search field.

Unfortunately there seems to be no option to adjust the border color there also.

So I tried the following CSS instead:

.search-form {
    border: 1px solid #fff;
}

Please advise why this is not working.

Thanks,
Jan

March 21, 2021 at 3:41 pm #1704357

Hi Jan,

Not sure if I understand - there isn't border added to the navigation search by default.

If you want to add one, you can try this:

.navigation-search input[type="search"] {
    border: 1px solid #000;
}

March 22, 2021 at 12:29 am #1704585

Hi Leo,

Thanks for getting back. Adding your CSS code snipped does the job.

However, I'd like to also understand how I can activate existing CSS settings. When I open Google Dev Tools and inspect the navigation-search element it shows default values for border color etc. (see screenshot and related markups).

How can I activate those instead?

Best regards,
Jan

March 22, 2021 at 6:12 am #1704890

Hi there,

you can't re-activate them - the navigation search has some CSS that overwrites the themes default input CSS values. You simply need to use the CSS that Leo provided

March 22, 2021 at 6:44 am #1704943

Copy that. Thanks David

March 22, 2021 at 8:05 am #1705248

You're welcome

This archived topic is closed to new replies.

Start building better websites today.