Community Forums › Forums › Archived Forums › Design Tips and Tricks › H2 and page width
- This topic has 3 replies, 2 voices, and was last updated 8 years, 11 months ago by Christoph.
-
AuthorPosts
-
April 27, 2015 at 5:43 pm #149341AnnamarieParticipant
So there must be something basic that I don't know and am missing. I'm a newish user to Genesis - bringing my site over from Thesis. I've got Design Palette Pro and Freeform Settings plugin. I also have the css file open in TextWrangler.
I've been trying to change the page width AND the color of the H2 tag. Neither one seems to work. They works in LiveCSSEditor in Safari, and in MagicCSSTricks in Chrome, but when I put it in the style sheet for my child theme (lifestyle pro) it won't "take".
Here is the snippets:
h2 {
color: #1c6Ba4;
}body .page-id-3743 div.entry-content {
max-width:500px;}I've also tried it as
body .post-3743 div.entry-content {
max-width:500px;}I realize you ,dear reader, can't troubleshoot - but is there a system to editing the stylesheet I don't know?
It's VERY frustrating.
Thanks
http://Local
AnnamarieApril 27, 2015 at 11:46 pm #149357ChristophMemberHi Annamarie,
are you saying that you are editing the style.css in the WordPress Editor, saving the changes and the changes are not being saved?
Or are you saying you are editing the style.css in TextWrangler, saving the changes, uploading the new style.css, overriding the existing one, and the changes are not showing?
Is a caching plugin active?
Did you clear the browser cache and cookies?
April 28, 2015 at 2:21 am #149359AnnamarieParticipantHi Christoph,
Thanks for replying. I'm up in the middle of the night because I'm bugged by this.
I'm saying the latter. I'm running MAMP on my MacBook Air. I've got the style.css file open in TextWrangler (I also tried Brackets) I save the file, in Safari go to the http://localhost:8888 address, refresh and the change is not there. Asking about clearing caches was a good suggestion. I've just made sure I've done that. No dice.
This must be a case of my not understanding CSS cascade?
In the style.css file for the child theme there is this code:
h1,
h2,
h3,
h4,
h5,
h6 {
color: #222;
font-family: 'Droid Sans', sans-serif;
font-weight: 300;
line-height: 1.2;
margin: 0 0 24px;
}I deleted the color line. Put my
h2 {
color: #1c6Ba4;
}
right below it and it didn't work.When I go in and change the color for all the h tags like this:
h1,
h2,
h3,
h4,
h5,
h6 {
color: #1c6Ba4;
font-family: 'Droid Sans', sans-serif;
font-weight: 300;
line-height: 1.2;
margin: 0 0 24px;
}That works!
WHY????
Thanks for the help..
April 28, 2015 at 7:19 pm #149453ChristophMemberIt might be too close to the original selector.
The "cleanest" way of writing the code would be to remove the h2 from the
h1, h2, h3, h4, h5, h6 {
and just give it its own selector.
For targeting the .page-id-3743 you can try dropping the leading .body and the .div in front of .entry-content.
And if you are not sure if you are targeting the right selector or wonder why a width doesn't change...
try changing something that will be visible right away, like changing the color or throw in a display: none;
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.