Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • February 19, 2016 at 1:18 am #585808
    AirstreamCoach

    Hi. I added some extra padding to a layout for desktop viewing, to add “spaciousness”. However, when viewed in responsive mode, the padding is overaccentuated– thus forcing the content (in this case, an accordion module) into a very narrow column. Below is a link to the FAQ page in question. You will see what I mean if you view the page on a mobile device or browser device emulator. Is there a way to eliminate a particular element (such as this padding in this case) in responsive mode only? CSS? thanks very much for your help.

    February 22, 2016 at 5:55 am #586838
    Ismael

    Hey AirstreamCoach!

    Thank you for using Enfold.

    Please try this in the Quick CSS field:

    @media only screen and (max-width: 767px) {
.responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
    margin: 0;
    margin-bottom: 20px;
    width: 100%;
    padding: 10px 20px 10px 20px !important;
}
}

    If you need to apply this changes to a certain element, turn on the custom css class field: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

    Regards,
    Ismael

    February 23, 2016 at 2:39 am #587522
    AirstreamCoach

    Works perfectly! Thank you!

    February 23, 2016 at 9:12 am #587591
    Basilis

    Hi!

    Glad you got it short out.
    Please do let us know if you need anything else, we will be happy to hear

    Regards,
    Basilis

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