Return to previous page

Create a border around social icons in footer

This topic has 1 reply, 1 voice, and was last updated 1 minutes ago ago by TheOne

TheOne

Participant

January 22, 2025 at 17:35

Hello,

I am trying to add a border around social icons in footer. i inserted a custom css directly into the block and not the theme options. The code is:

/* Custom border for social icons */
.et-icon {
border: 2px solid #fff; /* 2px white border */
padding: 10px; /* Add padding for spacing between the icon and the border */
}

/* Optional: Add hover effect */
.et-icon:hover {
border-color: #fff; /* Keep the white border on hover */
background-color: rgba(255, 255, 255, 0.1); /* Optional: Add a subtle background color on hover */
}

The problem is that now every icon on the page with the .et-icon is also getting a border. Isn’t the point of the modules css that it applies the code only to the specific module?

Link to page in private.

Thank you,

Content is visible for topic creator and
support staff only.

#431774 Copied
Viewing 1 results - 1 through 1 (of 1 total)

You must be logged in to reply to this topic.Log in/Sign up

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder

Grocery Market – Multivendor WP WooCommerce Theme

lazy-placeholder

Royal – WooCommerce WordPress Theme

lazy-placeholder

Electron Store 02 – WordPress WooCommerce Theme

lazy-placeholder

Poster – WooCommerce Theme

lazy-placeholder

Animals Store – WooCommerce Theme

lazy-placeholder

Beaty & Cosmetics – WordPress WooCommerce Theme

lazy-placeholder

Business Card – WordPress Theme

lazy-placeholder

HandMade Store – WooCommerce Theme

lazy-placeholder

Concert Store – WordPress WooCommerce Theme

lazy-placeholder

Minimalist Outfits – WordPress WooCommerce Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.