Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • March 21, 2016 at 2:45 pm #601248
    maccadigital

    Hello,

    I’m using the partner element to add some visual links to a site i’m working on. Currently there is one row, with 8 columns.

    When I view it on mobile, this responsively changes to 4 rows with 2 columns.

    What I would like is for there to be 2 rows with 4 columns displayed on mobile.

    I’ve tried some of the CSS suggested in other threads, but that seems to be more about adjusting sizes.

    please help!

    March 21, 2016 at 3:24 pm #601275
    Yigit

    Hi maccadigital!

    Can you please post the link to your website so we can provide you accurate custom CSS code?

    Regards,
    Yigit

    March 21, 2016 at 3:35 pm #601287
    maccadigital

    Hey :)

    Thanks

    http://Www.maccadigital.com/clientfiles/andywhitby

    Thanks again :)

    March 22, 2016 at 12:01 am #601605
    maccadigital

    Were you able to look at the link? :)

    March 24, 2016 at 12:00 am #602840
    maccadigital

    Sorry to chase, trying to get this sorted :)

    March 24, 2016 at 2:40 pm #603081
    Yigit

    Hi!

    Can you please post a screenshot and show the changes you would like to make? I cannot seem to find partner element on your page :/

    Cheers!
    Yigit

    March 24, 2016 at 5:03 pm #603246
    maccadigital

    Link to screen grab in the private comments.

    It shows the desktop version and the mobile version. Essentially, for the mobile version, I would like there to be 2 rows of 4 columns.

    Thanks :)

    March 24, 2016 at 5:08 pm #603250
    Yigit

    Hi!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

     @media only screen and (max-width: 767px) {
.avia-content-slider .slide-entry-wrap {
    width: 100%;
}
.responsive #top #wrap_all .slide-entry {
    width: 23%;
    clear: none!important;
}}

    Regards,
    Yigit

    March 24, 2016 at 5:14 pm #603258
    maccadigital

    Thanks for the reply Yigit, it’s really appreciated.

    I’ve tried the code, and although it works, the spacing between the elements horizontally is not even. The middle two are much closer than they are to the outer two?

    Link to screen shot in private comments.

    Thanks

    March 24, 2016 at 5:18 pm #603262
    Yigit

    Hey!

    Please change the code to following one

     @media only screen and (max-width: 767px) {
.avia-content-slider .slide-entry-wrap {
    width: 100%;
}
.responsive #top #wrap_all .slide-entry {
    width: 25%;
    clear: none!important;
    margin-left: 0;
}}

    Cheers!
    Yigit

    March 24, 2016 at 5:30 pm #603269
    maccadigital

    Thank you :)

    Is there a way to keep the larger gap between the elements, rather than remove it all?

    Thanks!

    March 24, 2016 at 5:36 pm #603273
    Yigit

    Hey!

    You can adjust width and margin-left values to do so :)

    Regards,
    Yigit

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