Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Center area post/pages »

[SOLVED] CSS Inserts


  #1  
Old Apr 11, 2012, 01:19 PM
webgurl's Avatar
webgurl
 
59 posts · Nov 2010
WordPress 3.0/Atahualpa 3.4.9/Firefox 3.6.12/XP sp3/
I am trying to change the color on a page. The page is div post-11, so says Firebug.

When I put this into CSS inserts, why doesn't it work? I am still having a hard time knowing how to format CSS in the CSS inserts correctly. Everything I put there is usually ignored. Yes, i save the additions I put in there.

Code:
div#post-11 .post-11 page type-page hentry post odd
{background-color:#b0c4de;}
ATA 3.7.3 - Wordpress 3.0.3

Thank you
  #2  
Old Apr 11, 2012, 02:19 PM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
That CSS is not correct. Reading Firebug and knowing which selectors to use does take a little getting used to. The way I suspect the code should be is as follows.
HTML Code:
div#post-11 {background-color:#b0c4de;}
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #3  
Old Apr 11, 2012, 02:30 PM
webgurl's Avatar
webgurl
 
59 posts · Nov 2010
WordPress 3.0/Atahualpa 3.4.9/Firefox 3.6.12/XP sp3/
Quote:
Originally Posted by lmilesw
That CSS is not correct. Reading Firebug and knowing which selectors to use does take a little getting used to. The way I suspect the code should be is as follows.
HTML Code:
div#post-11 {background-color:#b0c4de;}
That doesn't work either, I tried that from the start. I appreciate your input, though. Any other ideas what might be causing this code to be ignored? I am running the site on a local development server - WAMP - but that should not matter, should it?
  #4  
Old Apr 11, 2012, 04:01 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
try an !important
HTML Code:
div#post-11 {background-color:#b0c4de !important;}
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Apr 13, 2012, 03:26 PM
webgurl's Avatar
webgurl
 
59 posts · Nov 2010
WordPress 3.0/Atahualpa 3.4.9/Firefox 3.6.12/XP sp3/
Using !Important did not affect the statement at all. I disabled the Ultimate TinyMCE plugin, but that didnt help. I copied the entire CSS path in firebug and put that in CSS Inserts, but no luck. I dont know why I have such a difficult time making CSS inserts work.

I exported my settings if you have time to take a look and see why my simple css statement to change to background color on a page will not work.

Thanks...
Attached Files
File Type: txt ata-127001-20120413.txt (20.3 KB, 1026 views)
  #6  
Old Apr 13, 2012, 03:47 PM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
You capitalized !important. The i needs to be lower case.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #7  
Old Apr 13, 2012, 04:36 PM
webgurl's Avatar
webgurl
 
59 posts · Nov 2010
WordPress 3.0/Atahualpa 3.4.9/Firefox 3.6.12/XP sp3/
Quote:
Originally Posted by lmilesw
You capitalized !important. The i needs to be lower case.
Well, I changed it to !important, right after the background-color: attribute, and the #fff000 value.
So it is selectors {background-color: #fff000 !important;} but it still does not work.

There must be something ridiculously simple that I am overlooking. I'm running the site on a WAMP development server, but cannot see how that would make a difference....
  #8  
Old Apr 13, 2012, 04:54 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
if you are trying to change the PAGE background, you need to use
HTML Code:
body.page-id-11 {background-color: #b0c4de;}
your original CSS which was
HTML Code:
div#post-11 .post-11 type-page type-page hentry post odd
{background-color:#b0c4de;}
says apply the color of #b0c4de to
an html element of <odd> which is a child of
an html element of <post> which is a child of
an html element <hentry> which is a child of
an html element <type-page> which is a child of
an html element <type-page> which is a child of
any html element that has a class of .post-11 that is a child of
a <div> with a class of 'post-11'

that just isn't going to work. You really need to take a tutorial on CSS ID's and Classes. there are some good ones at htmldog.com and w3schools.com/css. The periods and pound signs are very important....
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #9  
Old Apr 13, 2012, 05:31 PM
webgurl's Avatar
webgurl
 
59 posts · Nov 2010
WordPress 3.0/Atahualpa 3.4.9/Firefox 3.6.12/XP sp3/
body.page-id-11 {background-color: #b0c4de;}

That did not work either. I have been reading and studying CSS IDs and Classes for days. I'm sure you can never know enough - but I think the way CSS Inserts works adds another piece to the puzzle.

Larry thought the line should perhaps read
Code:
div#post-11 {background-color:#b0c4de;}
and then you thought it should probably be
Code:
div#post-11 {background-color:#b0c4de !important;}
but your latest suggestion is
Code:
body.page-id-11 {background-color: #b0c4de;}
so it is hard to get a "feel" for the way the CSS Inserts should be constructed. It seems like it's a matter of "if not this" - "than that" - "or else"....

I sure appreciate all of your input, though. I'll let you know what finally works.
  #10  
Old Apr 13, 2012, 05:59 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
ok, lets look at this from the begining. you said
Quote:
I am trying to change the color on a page. The page is div post-11, so says Firebug.
when you refer to PAGE that is the entire page but then you say the page is div post-11.

the div with a class of post-11 is not the page but a small part of the page, the post. this would be a small part of the page and the CSS insert you said you used has a totaly invalid CSS Selector. If the CSS selector is invalid then the rule will never be applied.

Larry then gave you the css to change the background for a post with a class of post-11, assuming from our example, that you wanted to change the post background (see not having teh URL to look at what you want to change, we have to make some assumptions)

I suggested adding an !important because of the CSS selector precedence rules. It would caue this rule to be applied in case another rule was also being applied.

Then you stated you are trying to change the background color of the page, which is why I told you to use the body.page-id-11.... css - something that I tested and it works.

another issue could be that you are placing it at the end of your CSS inserts but you have a syntax error earlier which is causing all teh following css to be ignored.

so remove all your css inserts except for my last suggestion and see what happens. But remember that we can only go by the information you give us, when there is misleading information, or a answer is given using the wrong termonology the results might not be what you expect.

But keep working on it, if you can't show us the page, then attach a export of the settings ech time so we can look at whet you are actually doing.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #11  
Old Apr 13, 2012, 07:16 PM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
I just imported the setting you attached to a previous post and it shows the following on the last line
HTML Code:
html body.home div#wrapper div#container table#layout tbody tr#bodyrow td#middle div#post-11.post-11 {
background-color: #fff000;
}
I would take this line out and start over.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #12  
Old Apr 14, 2012, 10:22 AM
webgurl's Avatar
webgurl
 
59 posts · Nov 2010
WordPress 3.0/Atahualpa 3.4.9/Firefox 3.6.12/XP sp3/
Thanks for being kind and patient in your reply; my frustration at not being able to conquer HTML/CSS/Wordpress/Firebug and web site building in general is getting the best of me.

Although I started out with specific elements in mind to color, it came down to wanting to see any or all of the page change color; I just wanted to see the CSS Insert work on something!

I think Juggledad has hit the solution though. I am going to remove and save all of the CSS inserts except for the one I am working on.

Larry, that long selector that I put in there was overkill - it was the CSS path on the element I inspected in Firebug - The div #11 in the td#middle. You are right - I am taking it out.

Thanks again for sharing all of your expertise.

Sharon
  #13  
Old Apr 15, 2012, 10:27 AM
webgurl's Avatar
webgurl
 
59 posts · Nov 2010
WordPress 3.0/Atahualpa 3.4.9/Firefox 3.6.12/XP sp3/
Juggledad, you were right. I removed all of the code in CSS Inserts, ATA 3.7.3, leaving only the code to change the background-color, and it worked. So thank you to you and Larry for another valuable lesson in working with CSS Inserts in ATA Options. I wish I had thought of it myself, better luck next time.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
why Fields in the Atahualpa 3.3.3 does not expand? css inserts, html inserts krystyna New Versions, & Updating 3 Oct 28, 2010 12:22 PM
[SOLVED] 3.5.3 Default text in ATO&gt;Add HTML/CSS Inserts&gt;CSS Inserts boris_mcnorris New Versions, & Updating 4 Oct 16, 2010 03:57 PM
ADD HTML/CSS Inserts -- 3.5.1 --- Need to remove default CSS Inserts ortho New Versions, & Updating 0 Jun 23, 2010 03:17 PM
Re: Add html/css inserts RichardMathiason Atahualpa 3 Wordpress theme 4 Jun 9, 2010 01:36 PM
[SOLVED] why Fields in the Atahualpa 3.3.3 does not expand? css inserts, html inserts ppat2 New Versions, & Updating 3 Jun 2, 2009 05:41 PM


All times are GMT -6. The time now is 02:51 PM.


Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.