Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

  1. Home
  2. General Discussion
  3. text in front of carousel

text in front of carousel

Scheduled Pinned Locked Moved General Discussion
6 Posts 2 Posters 246 Views
  • 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.
  • J Offline
    J Offline
    jeff
    wrote on last edited by
    #1

    Hi everyone,

    I've read all the thread and tried everything css line and unfortunately it's not working for me haha.

    You can see on the website that I'm working on, there is a title "Geoffrey Pauchard" (class : name) which is fixed and the carousel below (class : carousel).
    When I'm scrolling down, the title is going behind the carousel element. I would like to have the title in front of the carousel. I've tried the z-index but it's not working.

    There is my css code for it :

    .name {position: fixed}
    .name {z-index: 99}
    
    .carousel {z-index: 1}
    

    website link: http://latelierjungle.com/geoffrey-pauchard

    Let me know if there is a way to make it work.
    Thank you in advance.

    Jeff

    1 Reply Last reply
    0
    • RichardR Offline
      RichardR Offline
      Richard
      Global Moderator
      wrote on last edited by
      #2

      Dear @jeff

      The z-index of the 2nd row with the image also is: '99'

      You must lower this rows z-index if you wish the First row with your 'Title' to be on top.

      Hope this helps and best wishes :)

      Richard

      1 Reply Last reply
      0
      • J Offline
        J Offline
        jeff
        wrote on last edited by
        #3

        Hi Richard, Thank you for your reply,

        Unfortunately it doesn't work. The carousel is still on the title.
        I've inspected the carousel block and it seems that when I remove all position div's in the main div which the class is called " row no-row -hoverimage row-2".

        See attached the the picture.

        Capture d’écran 2021-03-16 à 13.29.02.png

        There is a way to change the code of the carousel ?

        1 Reply Last reply
        0
        • RichardR Offline
          RichardR Offline
          Richard
          Global Moderator
          wrote on last edited by Richard
          #4

          Dear @jeff

          Your first-row that contains your Title should just need a z-index more that '1' :

          .first-row.row-0 {
              z-index:10 !important;
          }
          

          Here on my browser:
          Screen Shot 2021-03-23 at 8.16.56 PM.png

          I Hope this helps you Jeff
          Have a wonderful day, Thank you for using Lay Theme & talk soon

          Sincerely
          Richard

          1 Reply Last reply
          0
          • J Offline
            J Offline
            jeff
            wrote on last edited by
            #5

            @Richard said in text in front of carousel:

            .first-row.row-0 {
            z-index:10 !important;
            }

            It works !!! Thanks a lot Richard !
            Have a lovely easter week end :)

            Regards,

            Jeff

            1 Reply Last reply
            0
            • RichardR Offline
              RichardR Offline
              Richard
              Global Moderator
              wrote on last edited by
              #6

              Dear @jeff

              Great! :)
              Hope your Easter break was nice also,

              Best wishes
              Richard

              1 Reply Last reply
              0
              Reply
              • Reply as topic
              Log in to reply
              • Oldest to Newest
              • Newest to Oldest
              • Most Votes


              I also code custom websites or custom Lay features.
              💿 Email me here: 💿
              info@laytheme.com

              Before you post:
              1. When using a WordPress Cache plugin, disable it or clear your cache.
              2. Update Lay Theme and all Lay Theme Addons
              3. Disable all Plugins
              4. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"

              This often solves issues you might run into

              When you post:
              1. Post a link to where the problem is
              2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
              3. If the problem is difficult to explain, post screenshots / link to a video to explain it
              Online Users
              Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
              laytheme.com
              • Login

              • Don't have an account? Register

              • Login or register to search.
              • First post
                Last post
              0
              • Recent
              • Tags
              • Popular
              • Users
              • Search