- This topic has 29 replies, 3 voices, and was last updated 6 years ago by Leo.
-
AuthorPosts
-
June 25, 2017 at 7:11 pm #338915TomLead DeveloperLead Developer
You mean on mobile?
You could try reducing the header padding on mobile:
@media (max-width: 768px) { .inside-header { padding-left: 10px; padding-right: 10px; } }
June 27, 2017 at 1:39 am #339839johnzorook can i change the text size to smaller?
Would that make the search box smaller? and the search button
June 28, 2017 at 1:03 am #340501TomLead DeveloperLead DeveloperNot sure that would do anything. It looks good to me right now – can you show me a screenshot of what you’re seeing?
July 2, 2017 at 2:36 pm #343053johnzoroI want it looking similar to this on mobile view
July 2, 2017 at 9:25 pm #343169TomLead DeveloperLead DeveloperWhich part of it? Your logo is above and your search is below and full width? Looks pretty similar to me?
August 6, 2017 at 2:13 pm #360709johnzoroSorry for the late reply.
I want rhe greatest reviews logo smaller slightly and left aligned.
Similar to the screenshot of amazon and ebay
Can i have a magnifying glass instead of the word search
August 6, 2017 at 2:16 pm #360712johnzoroThis is how it looks currently
August 7, 2017 at 11:22 am #361158TomLead DeveloperLead DeveloperAdd this CSS:
@media (max-width: 768px) { .site-header .site-logo:not(.sticky-logo) { margin-left: 20px; margin-bottom: 10px; } .site-logo:not(.sticky-logo) img { max-width: 100px; } } input.search-submit { font-family: FontAwesome; padding: 13px; }
Then this PHP:
add_filter( 'generate_search_button','tu_custom_search_button' ); function tu_custom_search_button() { return ''; }
Of course, I can’t design your header to match Amazon, but this should definitely get you closer 🙂
August 7, 2017 at 1:54 pm #361260johnzorohttps://www.greatestreviews.co.uk/
that’s made the logo smaller but not left aligned?
also i don’t seem to have a magnifying glass only a box?
do i need to install a font or an icon or something?
also how do i get 1.4?
August 8, 2017 at 8:18 pm #361944TomLead DeveloperLead DeveloperCan you try the updated CSS?: https://generatepress.com/forums/topic/search-alignment-in-header/page/2/#post-361158
August 8, 2017 at 11:34 pm #361981johnzoroI am a plumb!
User error!
You are right tom and i am stupid.
It is working now.
Can i be a pain in the backside? the input box looks slightly bigger than the search button. is there a way to make that smaller so they are the same height?
if it’s too much work then don’t worry
August 9, 2017 at 12:05 am #361994johnzoroAlso now the logo on the transparent menu looks a bit funny like the dimensions aren’t right
Im not sure if you can see it on this screenshot
August 9, 2017 at 10:17 am #362254TomLead DeveloperLead DeveloperJust made a couple more adjustments to the CSS above that should take care of that: https://generatepress.com/forums/topic/search-alignment-in-header/page/2/#post-361158
March 23, 2018 at 9:01 am #528131johnzoroerr sorry to bump an old thread tom, but how would i adjust the css to make the search box right aligned on desktop view?
March 23, 2018 at 1:26 pm #528453LeoStaffCustomer SupportIt’s inserted as the header widget so I think simply remove the CSS should work.
-
AuthorPosts
- You must be logged in to reply to this topic.