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. Bug Reports
  3. Overylay background bug

Overylay background bug

Scheduled Pinned Locked Moved Bug Reports
5 Posts 3 Posters 207 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.
  • A Offline
    A Offline
    adam
    wrote on last edited by
    #1

    When applying an overlay as 100% width for both desktop and mobile with a background colour set it also works as expected.

    When you add any element to the page itself it overrides the background with a white background.

    See fleurduvent.com on mobile for bug

    1 Reply Last reply
    0
    • arminunruhA Online
      arminunruhA Online
      arminunruh
      Global Moderator
      wrote on last edited by arminunruh
      #2

      yes the background is just the background that appears next to your overlay if the overlay doesn't span a 100% width, as shown here on the left:
      Screenshot 2023-09-04 at 15.52.53.jpg

      the background of the overlay itself is always white or whatever color you set in the gridder of the overlay here:

      Screenshot 2023-09-04 at 15.54.25.png

      its not a bug, but i can see how people can think the background setting is for the background of the overlay content.

      you can however make the overlay content background transparent, which will result in showing whats underneath: your background setting you set in the overlay settings!

      just use this css:

      #lay-overlays #grid{
      background-color: transparent!important;
      }
      .lay-overlay > .lay-content{
      background-color: transparent!important;
      }
      
      A 1 Reply Last reply
      0
      • arminunruhA arminunruh

        yes the background is just the background that appears next to your overlay if the overlay doesn't span a 100% width, as shown here on the left:
        Screenshot 2023-09-04 at 15.52.53.jpg

        the background of the overlay itself is always white or whatever color you set in the gridder of the overlay here:

        Screenshot 2023-09-04 at 15.54.25.png

        its not a bug, but i can see how people can think the background setting is for the background of the overlay content.

        you can however make the overlay content background transparent, which will result in showing whats underneath: your background setting you set in the overlay settings!

        just use this css:

        #lay-overlays #grid{
        background-color: transparent!important;
        }
        .lay-overlay > .lay-content{
        background-color: transparent!important;
        }
        
        A Offline
        A Offline
        adam
        wrote on last edited by
        #3

        @arminunruh I understand. Thanks for clarifying. Is it possible to only adjust the background of 1 specific overlay? Using the overlay-ID doesn't seem to be doing the trick for me.

        1 Reply Last reply
        0
        • arminunruhA Online
          arminunruhA Online
          arminunruh
          Global Moderator
          wrote on last edited by arminunruh
          #4
          #lay-overlays #grid{
          background-color: transparent!important;
          }
          .lay-overlay > .lay-content{
          background-color: transparent!important;
          }
          

          sure just on chrome, right click the overlay, inspect element
          and get the appropriate css selector

          Screenshot 2023-09-05 at 09.39.39.png

          the css u used is this:

                      #lay-overlays #grid.id-37 {
                          background-color: transparent!important;
                      }
          
                      .lay-overlay > .lay-content {
                          background-color: transparent!important;
                      }
          

          however, you need to use #grid.id-18:

                      #lay-overlays #grid.id-18 {
                          background-color: transparent!important;
                      }
          
                      .lay-overlay > .lay-content {
                          background-color: transparent!important;
                      }
          
          1 Reply Last reply
          1
          • edgrbnzE edgrbnz referenced this topic on
          • alvarodozeA Offline
            alvarodozeA Offline
            alvarodoze
            wrote on last edited by
            #5
            This post is deleted!
            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
            I
            Ingi
            L
            lulu.ask.
            arminunruhA
            arminunruh
            A
            alasdair17
            W
            wyssseb
            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