Override/remove bottom margin – Google custom search box

  • I’ve been struggling with this for days so am hoping someone here can help.

    The search box in the footer of the site linked looks dreadful due to a table bottom margin css setting I believe, as you will see. I’ve tried every bit of css I can think of with my admittedly limited knowledge to override and remove the bottom margin so it all aligns better but have had no luck. In the chrome browser inspect tool removing the bottom margin works but after days of trying to write or copy the css I just can’t get it to work. Any help would be so much appreciated, thank you!

    I haven’t used a plugin for the search btw, just a couple of raw html entries using the code provided by google for the search box and results page.

    • This topic was modified 5 years, 2 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Everything else WordPress topic

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

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hello @matsp

    So you want to remove the bottom margin on that google search.

    You can add the following CSS code. 

    table.gstl_50.gsc-input {
margin: 0!important;
}
    • This reply was modified 5 years, 2 months ago by tenzinchoenyi. 
    table .gstl_50 .gsc-input {
margin: 0!important;
}
    Thread Starter Matt

    (@matsp)

    Hi Tenzin, many thanks for your reply!

    Sadly that hasn’t worked though ?? I don’t understand why not.

    The element…
    <table cellspacing=”0″ cellpadding=”0″ id=”gs_id50″ class=”gstl_50 gsc-input” style=”width: 100%; padding: 0px;”>…

    Still has the following applied…

    table {
    border-collapse: collapse;
    margin: 0 0 1.5em;
    width: 100%;
}

    and isn’t being overwritten by the suggested css.

    I’ve purged the cache and reloaded several times, do you have any other ideas please?

    • This reply was modified 5 years, 2 months ago by Matt.
    Thread Starter Matt

    (@matsp)

    Update…

    I’m using visual composer, in which the footer is designed and I added the following just to the local css in the footer in visual composer and it works and doesn’t seem to create any issues with any other tables in the footer…

    table {
margin: 0px 0px 0px !important;
}

    Probably not the best way to do it, but it works for now

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Override/remove bottom margin – Google custom search box’ is closed to new replies.