Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • February 22, 2015 at 8:27 am #400187
    freeethinka

    Hi again!

    I am building a page of thumbnail images/artist’s name below each using the 1/5 Layout Element to make 20 rows down x 5 thumbnails/artist name across. The names must remain in alphabetical order and it must be easy to add additional names and thumbnails over time. This is the ony way that I have figured out how to do this but the margins between the columns and rows is excessive and I would like to reduce them. I tried the Masonry Portfolio but I wasn’t crazy about the panel and its v-cut that appeared along the bottom edge and partly covering the bottom part of each image, plus I was not able to put the artist’s name below (and outside of) each image. So I decided against the Masonry Portfolio for this particular site. I would appreciate any suggestions and/or some Quick CSS to achieve this.
    You guys and gals—I know there’s got to be at least one, or two or three, or more there—ROCK! Thank you again for your terrific support.

    • This topic was modified 9 years, 10 months ago by freeethinka.
    February 23, 2015 at 10:58 am #400501
    Ismael

    Hi freeethinka!

    Thank you for using Enfold.

    Place all 1/5 columns inside a color section. Apply a unique id attribute using the For Developers: Section ID field. Use “custom-section” for example. Add this to the Quick CSS field to change the width and margin of the 1/5 column layouts inside that specific section:

    #custom-section div .av_one_fifth {
margin-left: 1%;
width: 19.2%;
}

    Regards,
    Ismael

    February 23, 2015 at 5:43 pm #400829
    freeethinka

    Thank you. I will try this.

    February 23, 2015 at 11:43 pm #401090
    freeethinka
    This reply has been marked as private.
    February 25, 2015 at 12:30 pm #401985
    Ismael

    Hi!

    First, edit the color section. Look for the For Developers: Section ID field. That is where you want to put the custom id attribute (custom-section). If you want to tighten up or decrease the margin between rows, use this on Enfold > General Styling > Quick CSS field:

    body #custom-section .column-top-margin {
margin-top: 10px;
}

    Cheers!
    Ismael

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