-
AuthorPosts
-
June 19, 2024 at 2:56 pm #1451991
Hi Enfold team,
I’m trying to overlap a column into the columns below. I tried using z-index as Yigit stated here: https://kriesi.at/support/topic/z-index-overlapping-element/ but it doesn’t work for me.
.hp-whats-new {
z-index: 99 !important;
}Please see private for page and creds.
- This topic was modified 6 months ago by welswebmaster.
June 20, 2024 at 8:04 am #1452088Hey Julie,
Thank you for the inquiry.
The structure or html of the page looks broken. The footer and socket container are not supposed to be inside the color section. Did you add any html tags to the page? Please try deactivating all plugins, then check all html on the page and make sure that all tags are closed properly.
Best regards,
IsmaelJune 20, 2024 at 3:30 pm #1452422Hi Ismael,
Thanks. The issue you pointed out was the socket CSS with position:fixed and now set to relative.But the initial issue I’ve reported remains where I’m trying to overlap top right column into the columns(color sections) below. I tried using z-index as indicated and its still not working.
June 21, 2024 at 6:06 am #1453407Hi,
Thank you for the update.
Apply an ID to the Color Section containing the Column element in the Advanced > Developer Settings > Custom ID Attribute field. Use “avwm-hero-section,” for example, then add this css code to pull the content below and make the column overlap with the next section.
@media only screen and (min-width: 989px) { /* Add your Mobile Styles here */ #avwm-hero-section { margin-bottom: -500px; } }
Best regards,
IsmaelJune 24, 2024 at 6:13 pm #1458482This reply has been marked as private.June 25, 2024 at 8:12 am #1458553Hi,
Thank you for following up.
and it won’t go under with this code
This is possible but you will have to change the background color of the first section to transparent. Please try this css code:
#hero-hp-whats-new { margin-bottom: -450px; position: relative; z-index: 9999; } #hero-hp-whats-new .container, #hero-hp-whats-new, #hero-hp-whats-new .entry-content-wrapper { background-color: transparent !important; }
Best regards,
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.