Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    How to: First thumbnail in column starting only at 40% browser height

    General Discussion
    2
    2
    17
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • L
      LN last edited by

      I’d like the first thumbnail image to only begin at 40% of the vertical height. That is, the whole column with thumb images, each with text underneath, should start at some distance from the top of the page.
      (see screenshot of design-dummy)
      Bildschirmfoto 2020-07-24 um 14.16.02.png
      I do not want to target a specific image as my client will update this thumbnail column on his own and I do not want him to have to attribute classes or delete attributions manually. So, there should be a more general solution targeting the first image in this column or to define a padding-top (?) for the whole column.

      I tried to target this column or the first image in this column, but it seems that the following images then have the same distance to the preceding image. I am stuck.
      Maybe there is some help? Thank you very much.

      www.neu.eder-la.ch

      1 Reply Last reply Reply Quote 0
      • Richard
        Richard Global Moderator last edited by

        Dear @LN

        I hope i understand your problem and please correct me if i am wrong :)

        The main content should start at 40% of the page's height, however because you want your client to have freedom to change picture we cannot target any one image specifically.

        Screen Shot 2020-07-29 at 3.25.05 PM.png

        Here in the picture above i have targeted to whole "grid" and increased its "padding-top" from 1% to 40% using "Custom CSS & HTML"

        Does this suit your needs or is it too simple a solution?

        Your client can still change the images and this will continue to use the 40%

        I hope this sets you in the right direction!

        https://www.khanacademy.org/computing/computer-programming/html-css

        https://www.khanacademy.org/computing/computer-programming/html-css/web-development-tools/a/using-the-browser-developer-tools

        These are two links that can introduce you to the basics of CSS if you having difficulty

        As always thank you heaps for using Lay theme and having Patience with the Forum

        Best wishes

        Sincerely
        Richard

        1 Reply Last reply Reply Quote 0
        • First post
          Last post

        Try this to fix issues before you post:

        Use the Search Feature. Maybe there is already a solution to your issue.

        1. Update Lay Theme and all Lay Theme Addons
        2. Disable all Plugins
        3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
        4. Now see if your problem solved itself
        5. Go here, see if your problem is listed here:
        Troubleshooting

        When you post:
        1. Post a link to where the problem is
        2. If the problem is difficult to explain, post screenshots / link to a video to explain it

        Thanks!

        Online Users

        S
        T
        G
        L
        M
        L

        Recent Topics

        • S

          Image hover -> Image on image

        • C

          centred Carousel fixed width and proportions

        • text underline

        • open all links in a thumbnail grid in a new tab

        laytheme.com