[Resolved] disable magnifying glass icon on pc view. and header widget search box slip down

[Immi]

Hello there,
1. how to hide magnifier search icons on desktop view.
2. how to slip down header widget search box on desktop view.

GP Premium 1.7.2

[Tom]

Hi there,

Give this CSS a shot:

.main-navigation li.search-item {
    display: none;
}

@media (min-width: 769px) {
    .header-widget {
        position: relative;
        bottom: -55px;
        z-index: 100;
    }
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Immi]

Thank Sir, Brilliant Exactly what I was looking.

[David]

Hi there,

can you explain a little more about the border, as i can see you already have this CSS:

.site-header {
border-bottom: inset 40px #DDD;
}

If you wanted a ‘gap’ between the two you could replace the border-bottom property with a margin-bottom property.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

2px bottom border to site header.
I have applied this CSS but not working in the mobile device

.site-header {
border-bottom: 2px solid #ff5c3e;
}

[David]

Aah ok thats because you have the mobile header, so we just need to include that like so:

.site-header, #mobile-header {
    border-bottom: 2px solid #ff5c3e;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Immi]

Thank You Sir,

[David]

Gla we could be of help

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts