Lay Theme Forum

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

    Carousel numbers alignment

    General Discussion
    3
    6
    37
    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.
    • H
      Hans Pelle last edited by

      Hi

      I'm using the carousel and im trying to align numbers to bottom of viewport and last line of my captions. Can't get it to work

      Heres a link:
      http://hanspellejart.dk/space-10-pop-up-event-copy/

      i tried using this:

      .captions-and-numbers-not-same-position .sink-with-numbers-and-captions .lay-carousel-sink .numbers {
          position: fixed !important;
          bottom: 16px !important;
      }
      

      Also numbers are disappearing when scaling my browser window? And when loading the page seems like captions load in the "original" place and then jumps down to the fixed position where i placed the captions with css overwrite. Is there anything to about this?

      Thanks
      Hans [link text](link url)

      M 1 Reply Last reply Reply Quote 0
      • H
        Hans Pelle last edited by

        Okay, I resolved part of my question myself :-) Seems like the load thing with the carousel captions is caused by specific "Transitions when Navigating" settings. When using "Up" under Revealing Transition captions load wired but using "Fade" works fine.
        Stil can't figure out how to align the numbers... :)

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

          in lay options → carousel addon: set both Captions for Slides: position and Numbers: position

          to "center"

          this will put them in the same div next to each other

          then use custom css to align that div to the left bottom corner :)

          1 Reply Last reply Reply Quote 0
          • M
            marcos @Hans Pelle last edited by

            @Hans-Pelle this is what I just did on a similar instance:
            Screenshot 2023-04-14 at 18.09.06.png

            ![.lay-carousel-sink-parent {
                     position: fixed!important;
                     bottom: 0!important;
                     right: 0!important;
            	margin-bottom: 2vw;
            	margin-right: 1.5vw;
              border: 0;
            }](image url)
            

            (I had previously tried the span.numbers class with no luck, the key seems to be moving the container inside which the numbers are placed)

            1 Reply Last reply Reply Quote 1
            • arminunruh
              arminunruh Global Moderator last edited by

              i have now seen like 3 people want this

              maybe i should code it as a feature

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

                u could always just also use the fullscreen slider addon to do this and like in lay options → fs slider addon

                use slide on page click
                and use fade effect

                then for every row in your gridder, use a browser height row and place your text and image in there

                1 Reply Last reply Reply Quote 0
                • First post
                  Last post
                Post a link to where the problem is
                I don't answer or check forum DMs, please just post on the forum.
                Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com

                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

                Recent Topics

                • H

                  sumbmenu on mobile device

                • Q

                  backdrop blur on ios

                • While editing the carousel, the images are not displayed correctly

                • Sticky Footer now has Background

                laytheme.com