Lay Theme Forum

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

    Fixed Textbox in Gridder

    General Discussion
    2
    5
    583
    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
      leandrodisler last edited by leandrodisler

      Hey
      I've created a centered/fixed text-element on this Page:
      http://leandrodisler.com/archiv
      Password is: hello

      I've made a regular textbox in the gridder and gave it a HTML class.
      This is in my Custom CSS:

      .archive{
      position: fixed;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      }

      Now the Problem: as you see the element is fixed and centered first but when i scroll the element jumps and takes a new position.

      What could be the reason for this?

      ps. Also i would love to have this text in front of the whole content of the site, is this possible?

      Thanks

      1 Reply Last reply Reply Quote 0
      • L
        leandrodisler last edited by

        I now changed it to:

        .archive{
        position: fixed;
        top: 35%;
        }

        Now the textbox dont jumps. But i dont have the exact reult as i wanted with the position...

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

          Dear @leandrodisler
          centering an element vertically is still a pain in the ass in 2018.
          There are many ways to achieve this.
          But in your case I would go for the super-simple solution:
          Give the font a proportional size (vh) and and position it like that.

          Since you do not have a dynamic text inside – this is totally possible.

          Best!

          Marius

          www.mariusjopen.world

          1 Reply Last reply Reply Quote 0
          • L
            leandrodisler last edited by

            Like this?

            .archive{
            font-size:40vh;
            position: fixed;
            top: 32%;
            }

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

              Dear @leandrodisler
              sure! If that works for you.

              Best!

              Marius

              www.mariusjopen.world

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

              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

              T
              S
              H
              A

              Recent Topics

              • K

                Unable to update lay theme / to login wp admin

              • S

                Theme crashed - because of Polylang?

              • A

                New button feature not available

              • A

                carousel addon not working after update

              laytheme.com