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. Menu bar insert instead of overlay

Menu bar insert instead of overlay

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

    Hello Richard,
    I was just working on my menu bar (see my other question) and I'm very confused about the behavior of the menu bar. I thought it would be "inserted" on top of the page (like an extra row on top), not that it is just put "on top" (overlaying) what's already there underneath.

    See example below:
    I need about 60px for the menu bar to actually work as the background for my menu points. But at that height, the menu bar "hides" the top of my pages, which I don't want. (for example in the cart, the top line just vanishes, because it is hidden by the menu bar).
    Only at about 30px height would that line be visible again, but then on other pages, the menu bar is not high enough for the menu points to fit.
    I don't understand why the menu isn't just "inserted" on the top of the page, like a seperate row would be in the gridder.
    Is there any css that I can use so the menu bar is just always on top and doesn't hide the upper part of my pages?
    I hope I explained this understandably.
    Thanks again!

    Edit: for some reason I can't add the screenshots, I hope you understand what I mean without them.

    B 1 Reply Last reply
    0
    • B Bella

      Hello Richard,
      I was just working on my menu bar (see my other question) and I'm very confused about the behavior of the menu bar. I thought it would be "inserted" on top of the page (like an extra row on top), not that it is just put "on top" (overlaying) what's already there underneath.

      See example below:
      I need about 60px for the menu bar to actually work as the background for my menu points. But at that height, the menu bar "hides" the top of my pages, which I don't want. (for example in the cart, the top line just vanishes, because it is hidden by the menu bar).
      Only at about 30px height would that line be visible again, but then on other pages, the menu bar is not high enough for the menu points to fit.
      I don't understand why the menu isn't just "inserted" on the top of the page, like a seperate row would be in the gridder.
      Is there any css that I can use so the menu bar is just always on top and doesn't hide the upper part of my pages?
      I hope I explained this understandably.
      Thanks again!

      Edit: for some reason I can't add the screenshots, I hope you understand what I mean without them.

      B Offline
      B Offline
      Bella
      wrote on last edited by
      #2

      @Richard never mind, I just found this support article (didn't find anything before) but it solved my problem I think :)
      http://laythemeforum.com:4567/topic/409/precise-menu-design-with-logo-on-top/2

      B 1 Reply Last reply
      0
      • B Bella

        @Richard never mind, I just found this support article (didn't find anything before) but it solved my problem I think :)
        http://laythemeforum.com:4567/topic/409/precise-menu-design-with-logo-on-top/2

        B Offline
        B Offline
        Bella
        wrote on last edited by
        #3

        @Richard ok sorr,y, the problem isn't totally solved after all.
        So I did add a frame on top so on the normal pages everything works fine with the menu now, but on the cart page the problem persists, that the top line is covered by the menu (https://rosereichart.com/cart/)
        How can I solve this?
        Sorry for the back and forth on this..
        Thank you!

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

          Dear @Bella

          The current margin-top is set to 50px. The Top frame of a woocommerce page e.g Cart is defined in customize via:

          Customizing ▸ WooCommerce > WooCommerce Spaces:

          Screen Shot 2022-03-14 at 4.30.38 PM.png

          If needed Bella you can use the following CSS to work for your Cart page, you can set whatever amount you wish:

          .slug-cart #lay-woocommerce {
              margin-top: 100px !important;
          }
          

          Hope this helps Bella & have a great day ⭐️
          Richard
          B 1 Reply Last reply
          0
          • RichardR Richard

            Dear @Bella

            The current margin-top is set to 50px. The Top frame of a woocommerce page e.g Cart is defined in customize via:

            Customizing ▸ WooCommerce > WooCommerce Spaces:

            Screen Shot 2022-03-14 at 4.30.38 PM.png

            If needed Bella you can use the following CSS to work for your Cart page, you can set whatever amount you wish:

            .slug-cart #lay-woocommerce {
                margin-top: 100px !important;
            }
            

            Hope this helps Bella & have a great day ⭐️
            Richard
            B Offline
            B Offline
            Bella
            wrote on last edited by
            #5

            @Richard yes perfect, thank you!

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

              Thanks @Bella ! 👍

              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
              dafvD
              dafv
              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