Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #1245023

    Dear team,

    I already searched your forum and found several answers to my problem, but I cannot seem to get them to work.

    I have three columns with seemingly the same amount of text, but if the website is viewed on a smaller screen, the lines of each column break differently, which is why the buttons at the bottom of each column are not aligned at the same height anymore.

    I already tried this css https://kriesi.at/support/topic/buttons-alignment-in-columns-to-the-bottom/, but I cannot seem to get it to work. Can you maybe help me find the problem? That would be great, thank you!

    #1245275

    Hey mausheld,

    Are you referring to the red buttons below the 3 different coloured icons a bit down on the page? If so then please assign classes to the layout elements in the theme options, so that we can target them with custom CSS.

    Best regards,
    Rikard

    #1245902

    Hey Rikard,
    Correct, these are the buttons I was referring to. See the assigned classes in private content.

    Thank you for your help!

    #1245940

    Hi,

    Do you want them to still be 3 columns or should they be full-width stacked on mobile?

    Best regards,
    Jordan Shannon

    #1246013

    Hey Jordan,
    full-width stacked on mobile sounds great!

    Thank you!

    #1246201

    Hi,

    Thanks for the update. I still can’t see any classes assigned to the elements though, could you please try adding them again? We can give you general CSS to use, but then it would affect your other 1/3 elements as well. We can give you CSS specific to that page only, if you prefer that.

    Best regards,
    Rikard

    #1246818

    Hey,

    Thank you, weird. I put the custom class into the CSS line of each column, see screenshot. Is that correct?

    Otherwise I’d be happy to take a page specific CSS! (page id can also be seen in screenshot :)

    Thank you very much for your help and all the best

    Lisa

    #1247058

    Hi,

    Thanks for that, but the classes you referred to are still not there on the front end. It looks like you have added a comma after the class in your screenshot, if that is the case then please remove that. If you need further help then please include admin WordPress login details in private, so that we can access the backend of your site.

    Best regards,
    Rikard

    #1247428

    Thank you very much for your patience. The comma is added every time I save and exit the element. And if I don’t remove the custom class name from the developer tab, the custom class name even duplicates itself.

    Please find the login details attached.

    Thank you very much!

    #1247537

    Hi,

    Thanks for that, the login details are not working though. Please check and verify.

    Best regards,
    Rikard

    #1247681

    Sorry for this!

    #1247860

    Hi,

    Thanks for that. I’ve added the classes for you, please try adding this to Quick CSS:

    @media only screen and (max-width: 767px) {
    .hscolumn {
      width: 100%;
      margin-left: 0;
    }
    }
    
    @media only screen and (min-width: 768px) and (max-width: 1300px) {
    .hscolumn .av_textblock_section {
      height: 120px;
      min-height: 120px;
    }
    }

    Best regards,
    Rikard

    #1247907

    Hey, thank you, unfortunately that did not help, the buttons still change position if I resize the screen. See for example a screenshot attached.

    #1248045

    Hi,

    I added the code for you and it’s applying now, please review your site.

    Best regards,
    Rikard

    #1248156

    Thank you so very much! I really appreciate your great support!

    #1248184

    Hi,

    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 16 posts - 1 through 16 (of 16 total)
  • The topic ‘Align buttons’ is closed to new replies.