Whenever I attempt to add this customized CSS button to my company's website, it disrupts the center alignment of the entire webpage.
Below is the HTML code:
<div id="contain">
<button class="support"> </button>
Here is the corresponding CSS:
button.support {
background: rgb(38,128,195); /* Old browsers */
background: -moz-linear-gradient(top, rgba(38,128,195,1) 11%, rgba(30,101,155,1) 99%); /* FF3.6+ */
// More styles...
}
button.support:hover {
// Hover styles...
}
button.support:active {
//Active state styles...
}
Despite trying to switch from an input to a hyperlink, the issue persists. Upon adding the CSS code, the layout loses its horizontal alignment on the page. No obvious conflicting elements are present in the code.
The problem seems to be related to the #site div disappearing. The cause behind this behavior remains unclear...
This particular element was intended for implementation on the following page: