Search button too high on desktop screen

  • Resolved Marco

    (@marco020)


    6 years, 4 months ago

    Dear volunteers,

    I have customized the search button in custom CSS. I am facing a problem. This happens only when there are no search results to display.

    On the search results page the button looks fine on a tablet screen and a mobile screen. However on a desktop screen the height of the button is much higher than the search box. This problem only appears on the search result page and only on a desktop screen.

    You will see what I mean if you, for example, search for ‘child’ on my website.

    I have been puzzling for two hours now but I can not fix the problem. I would really appriciate any help. Thx!

    Marco

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I would undo this bit in your child theme:

    
.search-form .search-submit .icon {
	height:1.2rem;
	top:-0.6rem;
	left:0rem;
	width:1.2rem;
}

    Then add this:

    
.search-form .search-submit {
    height: 2rem;
    bottom: 0;
    top: auto;
    padding-top: 0;
    padding-bottom: 0;
    width: 1.2rem;
}
    Thread Starter Marco

    (@marco020)

    Your fix works perfectly Andrew. Thank you so much!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Search button too high on desktop screen’ is closed to new replies.