1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.4 Page node styling

Discussion in 'Styling and Customization Questions' started by grantus, Feb 26, 2015.

  1. grantus

    grantus Active Member

    I've been trying to style certain nodes with different background colors, for example.

    So let's say I have node 146 and I want to give it a background of #ccc, I have this:

    li.node.page.level_2.node_146 {background: #ccc;}

    But nothing happens. When I add that rule in my browser's element inspector, it works.

    Also, I've done the same thing with certain node category backgrounds, but for the the node backgrounds themselves, I'm stuck.

    Any suggestions?
  2. Amaury

    Amaury Well-Known Member

  3. grantus

    grantus Active Member

    Conditionals are good but for this it should be purely a CSS fix. As I mentioned, I did it for the node categories but the nodes aren't playing nice for some reason.
  4. Amaury

    Amaury Well-Known Member

  5. grantus

    grantus Active Member

    Good link. I tried it but so far nothing. That seems like the most logical though.

    My node from the <body> is node17.
    The node part I want to style is <li class="node page level_2 node_146">

    What would you suggest I try in the CSS? I tried a few variations like:
    .node17 .node .page .level_2 .node_146
    .node17 li.node_146
  6. Optic

    Optic Well-Known Member

  7. grantus

    grantus Active Member

    Actually, for some reason it works now, I have no idea why.

    I used this:

    li.node.page.level_2.node_146 {background: #ccc;}

    And it works.

    Thanks anyway.

Share This Page