Elaine
Elaine

Reputation: 443

Can't hide footer on non-home pages

I'm trying to hide the footer from non-home pages. Below is what I have tried, This is the website

.home #first  {
    width:950px;
    margin-top:20px ;
    border-top: 1px dotted #9bacd4;
    background:#ff0000;
}


.home #first img {
    margin:5px;
}

.home #first h3
{
   font-size:16px;
   font-weight:bold;
   margin:5px 0px 15px 15px;    
}

#first {
    display:none;
}

Upvotes: 1

Views: 1771

Answers (4)

gSaenz
gSaenz

Reputation: 677

Use the is_home() function reference to control where you display your footer. Read the documentation.

Upvotes: 0

I would put a class in the tag of your home page that says something like .

Assuming your footer block has something like or you could then use CSS to specify that the footer is only visible on the Home Page.

.footer {display:none;}
.home .footer {display:block;}

Should work!

Upvotes: 0

Mirko Adari
Mirko Adari

Reputation: 5103

Both of your CSS rules .home #first and #first are used. If you have overlapping properties, the most specific wins. So in this case add display:block to .home #first selector and it will override the display:none, as .home #first is more specific.

Upvotes: 5

feeela
feeela

Reputation: 29932

You should set it to hidden first and then display it on a specific condition, for example on the homepage:

/* hide for all pages */
#first {
    display: none;
}

/* but display it on the homepage */
.home #first {
    display: block;
}

Upvotes: 2

Related Questions