Tagged: 

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • January 23, 2017 at 9:59 am #737173
    cd2s

    Hello Enfold Support Team

    I am testing options for a client and added the post slider to display properties (they are a real estate). I initially tested the Masonry but I don’t think that it does what he wants unless we have the same amount of properties for each category and display “all”. Because as soon as I say display for example “8”, it won’t show all categories in the filter.

    The other option is that I add a slider (not my favourite option) for each category but the gap is so massive. Is there a way I can make the gap exactly the same size as in the Masonry above on the page? (link below). Also no rounded corners and have the slight gray box like in the Masonry?

    I will also have to hide the Category but I should be able to figure that out…

    Thanks so much,
    Corina

    January 26, 2017 at 10:25 am #738817
    Nikko

    Hey Corina,

    Try adding this css code in Quick CSS (located in Enfold > General Styling):

    .avia-content-slider-inner .av_one_fourth {
    margin-left: 2.6666667%;
    width: 23%;
}

.avia-content-slider-inner .av_one_fourth.first {
    margin-left: 0;
}

    Hope this helps.

    Best regards,
    Nikko

    January 27, 2017 at 8:36 am #739268
    cd2s

    Hi Nikko

    Thanks so much. I applied the CSS you provided and the gap was still bigger than the Masonry… so I had a bit of a play with the % (not sure if I’ve done it correct)… but I amended it to the following, so it now visually looks the same as in the masonry.

    .avia-content-slider-inner .av_one_fourth {
    margin-left: 1.5%;
    width: 23.875%;
    }

    .avia-content-slider-inner .av_one_fourth.first {
    margin-left: 0;
    }

    The one issue I still have though, is that it expanded the container (grey) but not the image…. how can I make the image resize to fit the column width, without it looking pixelated? When I look at the HTML & CSS I can see that it loads a 270px size image into the container… is there a way to make it load a larger size that fits the whole width of the column and adjusts in height proportionally?

    //Update Note… for some reason it just stopped working at all… not quite sure why… I even tried to copy/paste back your css and it doesn’t do a thing?

    Thanks so much.
    Corina

    • This reply was modified 7 years, 9 months ago by cd2s. Reason: it just stopped working... not quite sure why as I didn't do anything else
    January 28, 2017 at 9:14 pm #739776
    Nikko

    Hi,

    Do you have a caching plugin enabled, or some plugins that allow custom css, try to disable it, as it might be the cause.

    Best regards,
    Nikko

    January 30, 2017 at 2:20 am #740061
    cd2s

    Hey Nikko

    Okay I got it… deleted everything and started from scratch… also got the image to resize with the following code… in case anyone else needs the solution:

    .avia-content-slider .slide-image, .avia-content-slider .slide-image img {
    border-radius: 0 !important;
    display: block;
    margin: 0 auto;
    position: relative;
    width: 100%;
    }

    definitely did not have a caching plugin.

    Thanks for all your help.
    All the best,
    Corina

    February 1, 2017 at 9:01 am #741081
    Rikard

    Hi Corina,

    Great, glad you got it working and thanks for sharing your solution. Please let us know if you should need any further help on the topic.

    Best regards,
    Rikard

    February 1, 2023 at 3:07 pm #1396231
    scitation

    Hi,

    I’m trying to have the columns gap bigger between posts (in the post slider), but the css code above is not working for me.

    Can you help me with that?

    Thank you very much!

    February 1, 2023 at 7:38 pm #1396278
    Rikard

    Hi scitation,

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

    .avia-content-slider .av_one_third {
    margin-left: 10%;
    width: 26%;
}

.avia-content-slider .av_one_third.first {
    margin-left: 0;
}

    Best regards,
    Rikard

    February 2, 2023 at 12:21 pm #1396374
    scitation

    Hi Rikard,

    It was exactly that!
    Thank you very much!

    February 2, 2023 at 3:40 pm #1396408
    Nikko

    Hi scitation,

    I’m glad that Rikard could help you :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Post Slider – Gap Size’ is closed to new replies.