Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • October 20, 2020 at 5:56 pm #1254420
    ilonka78

    Hi
    I have some logos on my websites and looks good on computer screen (7 columns, 3 rows) but on mobile I have only one very long column of huge logos. Is there any way to make it look more like on computer screen on mobile? Thank you

    October 22, 2020 at 10:09 am #1254894
    Victoria

    Hey ilonka78,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 767px) {
  .responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry.first,
  .responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry {
      width: 48%;
  }
  .responsive #top #wrap_all .avia-content-slider-even.avia-logo-slider .slide-entry.slide-parity-odd,
   .responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry.slide-parity-even {
     clear: none;
   }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    October 22, 2020 at 4:26 pm #1255011
    ilonka78

    Hello
    That kind of work. I have 12 rows and 2 columns on mobile now so logos are still pretty big. Any way to make them smaller on mobile? Thank you.

    October 23, 2020 at 5:12 pm #1255311
    Victoria

    Hi ilonka78,

    You can play with the width value —- width: 48%; and find the one that works for you :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

    October 23, 2020 at 7:56 pm #1255331
    ilonka78

    Thank you but that’s not it yet. I tried with smaller width-28% and that only makes logos smaller but the rest of the column is empty. It would be ideal to have 4 logos in one column and with this code I can only have two. No matter what size they are.

    October 26, 2020 at 10:12 pm #1255875
    Victoria

    Hi ilonka78,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 767px) {
  .responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry.first,
  .responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry {
      width: 23%;
  }
  .responsive #top #wrap_all .avia-content-slider-even.avia-logo-slider .slide-entry.slide-parity-odd,
   .responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry.slide-parity-even {
     clear: none;
   }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    October 26, 2020 at 10:39 pm #1255884
    ilonka78

    I’m repeating my first answer. It seems like you didn’t read it. I played with the width value but that is not it. After applying new code (which is different only in the width property) I have the same issue. Thank you

    “Thank you but that’s not it yet. I tried with smaller width-28% and that only makes logos smaller but the rest of the column is empty. It would be ideal to have 4 logos in one column and with this code I can only have two. No matter what size they are.”

    October 30, 2020 at 4:59 pm #1257078
    Victoria

    Hi ilonka78,

    Could you please attach some screenshots of the issue?

    It does not look like you describe on my end, I would not suggest such a change.

    Best regards,
    Victoria

    October 30, 2020 at 5:16 pm #1257083
    ilonka78

    Hello
    This Is what is happening when width is set up to 28%. I took screen shots and changed it back to 38%.
    There is big white space on the right. There are also too many rows.
    Thank you.


    October 30, 2020 at 9:51 pm #1257174
    Victoria

    Hi ilonka78,

    I see. Thank you.

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    November 2, 2020 at 6:34 pm #1257669
    ilonka78

    Thanks. I have added it in private section.

    November 2, 2020 at 11:25 pm #1257764
    Victoria

    Hi ilonka78,

    Can you please make that account admin? We cannot test anything like that.

    Best regards,
    Victoria

    November 3, 2020 at 4:57 am #1257863
    ilonka78

    Hi
    Sorry. I have just changed it.
    Thanks

    November 4, 2020 at 10:30 pm #1258465
    Victoria

    Hi ilonka78,

    Thank you. I cannot seem to make them smaller and spread. Just 48% works fine. I can ask my colleagues to have a look.

    Best regards,
    Victoria

    November 5, 2020 at 4:07 pm #1258639
    Yigit

    Hey,

    I added following code to bottom of Quick CSS field

    
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry.first, .responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry {
    width: 12%;
    clear: none;
}} 
@media only screen and (max-width: 480px) {
.responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry.first, .responsive #top #wrap_all .avia-content-slider-odd.avia-logo-slider .slide-entry {
    width: 14%;
}}

    Please review your website :)

    Regards,
    Yigit

    November 11, 2020 at 5:36 am #1259760
    ilonka78

    Great. That is perfect now. Thank you!

    November 11, 2020 at 10:45 am #1259812
    Nikko

    Hi ilonka78,

    We’re happy to hear that :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 17 posts - 1 through 17 (of 17 total)
  • The topic ‘Partner logo element to big on mobile’ is closed to new replies.