Style a particular page sidebar

How do i get the sidebar on this homepage to be a fixed hight without the hight being fixed on any other of the pages?

so far I’ve tried: .home page page-id-2.sidebar { height: 500px; } but that hasn’t worked

http://79.170.40.244/healthmeanswealth.co.uk/

Give the home page a unique Id on the body tag and say #home #sidebar yada

ok do I change the current id’s the home page has or add another id? I notice some things have mulitple id’s and classes is this ok then?

oh and is the current id not unique?

You can just keep that one if its unique to its page. You can’t have two ids on the same tag. You can have a id and a class. Or multiple classes.

so if I can use the one already there what’s wrong withthe one i’m doing here:

.home page page-id-2.sidebar { height: 500px; }

have I done that wrone? I notice there’s spaces between home page page-id should I only use one or is that all one class?

Just use one. A id or a class. No need to specify both. #id #sidebar {…}

but if I only use #sidebar it will give a height to all of the sodebars in my site and if I only use #home page id it will not give a hight to the sidebar on the home page. I need to know how to correctly reference the sidebar on my home page only and using:

.home page page-id-2.sidebar { height: 500px; } didn’t work

Lol. If the home page is the only one with let’s say #home on the body tag then no, no other page will use this css rule…

#home #sidebar {…}

Yours example is not valid. The classes need a preseeding dot. If its two classes then it looks like .class1.class2 {…}

the body tag is like this:

<body class=“home page page-id-2 page-template-default logged-in admin-bar customize-support” id=“ls-global”

so what should my css rule be? I’m still confused

#is-global #sidebar

yea that one worked, so would that one be used because it is the id rather than using the classes tjat come before it? I mean in future do I just look for the id that is above the class that I want to change?

thanks for your help

<body class=“home page page-id-2 page-template-default logged-in admin-bar customize-support” id=“ls-global”>

hantaah,

The body tag shown above has 7 classes and 1 ID. Which do you think would identify that page uniquely? It should be the ID. If other pages use that same ID (the name suggests that they could), then you will have to create a unique classname instead and add it to the list (“unique” meaning one that is not used on any other page). Uniqueness, one-of-a-kind, is the objective.

The correct way to list a unique group of classes in css is to separate them with dots. For example, the above body tag might be identifiable by listing several of its classes:


.home.page.page-id-2.page-template-default.logged-in.admin-bar.customize-support {}

(Note the absence of spaces in the css address.)

This means that ALL of those classes must exist to target the tag that they belong to; in this case, the body tag.