Help with styling in a widget.

[Gemini23]

This is for a new widget in the primary sidebar.

Basically, this is for a search box script that pulls in a search box script from a third party website (our supplier)

All seems to work okay BUT the search box and its styling displays over the top of the other widget contents in the primary sidebar - ie currently I have SUBSCRIBE TO OUR NEWSLETTER and where to enter the email address etc and the new search box script contents simply displays over the top of it.

I expect it is something to do with the styling that comes with it but I don't know what to change to make the 'search box' sit within its own box and push down the next widget contents.

This is the styling...
<style>
#bbm-front-api-hybrid-qs-form {
padding: 2rem 1rem 0 1rem;
position: absolute;
bottom: 1rem;
top: inherit;
right: inherit;
left: inherit;
background: red;
}

#bbm-front-api-hybrid-qs-form #edit-show {
width: calc(100% - 1rem);
}
</style>

Help anyone?

[keyplyr]

... this is for a search box script that pulls in a search box script from a third party website (our supplier)

It would much more efficient if you copied that script to your own server. Then you could customize the CSS without interference.

This would also save an HTTP remote connection, improve speed, and get you a better grade with Google.

[Gemini23]

Thanks - resolved
#bbm-front-api-hybrid-qs-form {
position: relative;
bottom: auto;
top: auto;
right: auto;
left: auto;
background: red;
}

[tangor]

Another happy ending! If I were a puppy, tail would be wagging. As it is, I hoist a beverage and say kudos!:)