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. Change background color of columns

Change background color of columns

Scheduled Pinned Locked Moved General Discussion
7 Posts 2 Posters 1.2k 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.
  • R Offline
    R Offline
    rbnbm
    wrote on last edited by
    #1

    Hey there,

    I've been trying to do it like in this post, but it did not do not what I was expecting:

    Re: horizontal line + change background color of only one column + Align image in the middle of column

    Is it correct that only columns with content count as "childs"? Which for me is a problem because of mobile.

    What I am trying to do: having white text on black background in column 3 (which works, choosing child no. 1), but I would like the second column (left to the text) to be black as well. Also, I would like to layout some other pages with black areas in them.

    Thanks for any suggestions!

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

      Dear @rbnbm
      no. Childs are something different:
      https://www.w3schools.com/cssref/sel_nth-child.asp

      You can just give the column a class custom-column-background and then make it blue:

      .custom-column-background {
      background-color: blue;
      }
      

      Its pretty simple.

      I hope I could help!

      Marius

      www.mariusjopen.world

      1 Reply Last reply
      0
      • R Offline
        R Offline
        rbnbm
        wrote on last edited by rbnbm
        #3

        Hi Marius,

        Thanks!

        Unfortunately I don't know where/how to assign the class to the column in the gridder. In the dropdown menu I only find an option for the class of the row.

        Also - in case I get it going - would that affect the whole column, that is in every row?

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

          Dear @rbnbm
          right click on the column:
          0_1522958061676_Bildschirmfoto 2018-04-05 um 21.53.43.png

          And then enter the name of the class:
          0_1522958075820_Bildschirmfoto 2018-04-05 um 21.53.55.png

          And this you put into your CUSTOM CSS:

          .custom-column-background {
          background-color: blue;
          }
          

          0_1522958117200_Bildschirmfoto 2018-04-05 um 21.54.48.png

          All the best!

          Marius

          www.mariusjopen.world

          1 Reply Last reply
          0
          • R Offline
            R Offline
            rbnbm
            wrote on last edited by rbnbm
            #5

            Hey,

            thanks again – most likely I miss something, but if I do it exactly like you have written, the class is applied to the whole row. Change the class in one column, every other column gets the same class.

            As I tried to explain in my first post - it only works when there is content in the column, p.e. some text.

            Cheers!

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

              Dear @rbnbm
              Ah! Ok! The column!
              Sorry about this.
              That always confuses me. Columns and rows…

              No. Sorry. Not possible to make a different colour for the column.

              But there is a way:
              Make use of the STACK elements function.
              And give the stack element a class:
              0_1523199837616_Bildschirmfoto 2018-04-08 um 17.03.37.png

              Best!

              Marius

              www.mariusjopen.world

              1 Reply Last reply
              0
              • R Offline
                R Offline
                rbnbm
                wrote on last edited by
                #7

                Hi Marius,

                nice, that did the trick – thanks a lot for your help and support!

                Best
                Rbn

                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
                A
                alasdair17
                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