Page Properties

santiagonca

Hi,
One question...

Is it possible to have diferent types of pages...one with a white bg, one with a yellow bg, and other semi transparent?..

/* BG Color */
.page #content,
.no-results #content{
    background-color: #fff;
}
/* width */
.static-left #content,
.static-right #content,
.static-center #content{
    width: 420px;
}

The same code here, but on diferent styles...one yellow, one semi transparen....etc etc.

Air

santiagonca said: One question...

:-D It must be sarcasm after previous 6 ;-)

Yes you can try to write styles for page IDs, same idea as here http://support.apollo13.eu/discussion/982/text-directly-on-background-image/p1

You can see page id in Admin area in address bar, when you edit it(page).

With regards.

santiagonca

It will be like this?

/* BG Color */
.page-id-416 #content{
 background-color: #fff;
.static-center #content{
   width: 120px;

Air

You don't have to redefine all settings if you just wish to alter color, but it will be OK.
Test firstly, ask if it doesn't work.

With regards.

santiagonca

Already done:

/* width */
.page-id-172 #content{
    width: 420px;
   background-color:rgba(255, 255, 255, 0.7)
   
}

Thks a lot.

santiagonca

One more issue on this,
If i change this property,

/* width */
.page-id-172 #content{
    width: 420px;
   background-color:rgba(255, 255, 255, 0.7)
   
}

The responsive size doesnt work, if theres a solution to that?
thks

Air

You know, you are making customization of theme, and such things require some attention. This time I will help you with it, but please remember we are not here to make all work for ya ;-)
Use this custom CSS:

@media only screen and (max-width: 1060px) {
   .page-id-172 #content{
        width: auto;
    }
}

With regards.

santiagonca

Thanks a lot!

santiagonca

Im trying to put the same properties on diferent pages, but it doesnt seems to work:

/* width */
.page-id-151 #content{
 width: 420px;
 background-color:rgba(255, 255, 255, 0.7)
   
}

@media only screen and (max-width: 1060px) {
   .page-id-151 #content{
        width: auto;
    }


/* width */
.page-id-134 #content{
 width: 420px;
 background-color:rgba(255, 255, 255, 1)
 
}

@media only screen and (max-width: 1060px) {
   .page-id-134 #content{
        width: auto;
    }


/* width */
.page-id-416 #content{
 width: 300px;
 background-color:rgba(255, 255, 255, 1)
 
}

Air

Sorry, my code missed one }. Now it is fixed, so you have to also fix your code with it everywhere you copied it.

With regards.

santiagonca

And where do i put that }

Air

Checkout my fixed code two posts ago(last } is what is added there. Then recreate your own code again, cause now your lacking these.

With regards.

santiagonca

Thanks!..already did it