Tagged: , ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • March 18, 2022 at 11:24 am #1345040
    twofab

    Hi.

    i’ve got the newest Enfold with 2 Footer Columns.

    On mobile there is the break in 2 1 columns which is good, but the 2nd columns left is not in line with the first one. I don’t know why, or how to fix it.
    Do you have an solution for me?

    The yellow line.

    This space is my needed extra space to increase my data to get my telephone number in line.

    • This topic was modified 2 years, 4 months ago by twofab.
    March 18, 2022 at 12:27 pm #1345054
    Rikard

    Hey twofab,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
#custom_html-4 {
    margin: 30px 0 30px -12px;
}
}

    Best regards,
    Rikard

    March 24, 2022 at 10:48 am #1345842
    twofab

    Thanks! That worked.
    I’ve just had to add the !important so if anyone want to use this in the future:

    @media only screen and (max-width: 767px) {
#custom_html-4 {
    margin: 30px 0 30px -12px !important;
}
}

    That should work.

    May i ask another question here, or shall i open a new topic?

    I have an grid with 4 columns and in each column is a standard image box with Text as a Description in an overlay. I’ve changed the overlay to be in a box, which worked pretty well, but i can’t get figured out how to center the box, because each text has a different length. I provide an link for demo.

    #top .av-image-caption-overlay {
    height: 40px;
    width: auto;    
    left: 30%;
    bottom: 50px;
    border:2px solid white;
    transform: translateY(100%);    
}
    March 24, 2022 at 4:30 pm #1345895
    Rikard

    Hi,

    Thanks for the update. Could you post a screenshot highlighting your intentions please? Do you want to center the buttons, or do you want them the same width?

    Best regards,
    Rikard

    March 24, 2022 at 9:03 pm #1345930
    twofab

    Thanks for your Answer.

    Yes, i want to center these boxed titles:

    #top .av-image-caption-overlay {
    height: 40px;
    width: auto;    
    left: 30%;
    bottom: 50px;
    border:2px solid white;
    transform: translateY(100%);    
}

    This is not the best try, but changing to left: 50% would not fit.

    March 25, 2022 at 5:11 pm #1346041
    Rikard

    Hi,

    Thanks for the clarification. Please try this CSS instead:

    #top .av-image-caption-overlay {
    right: auto;
    display: table;
    margin: 0 auto;
    position: relative;
    top: 190px;
}

    Best regards,
    Rikard

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.