Editing Child Theme CSS Does Not Produce Changes on Website
-
Hello all!
This is my first post on these support forums. I’ve recently took on the responsibility of managing my organization’s website, and attempting to learn CSS and HTML to make minor adjustments and improvement. We’re a small nonprofit, and don’t have the resources to hire professionals.
I have two main issues here:
1. Recently, I’ve noticed that changes made to my child theme of Genesis (called Nancy, for whatever reason) are not reflected when viewing my website. I’ve tried viewing the site from multiple browsers, and tried clearing my cache and browsing history.
What seems to work is adding changes to the CSS to the “Edit CSS” tab under appearances, rather than making changes to directly to the style.css page under the child theme in the “Editor” tab.
I’d like to know if this issue is commonplace (aka not an issue), or if users should be able to edit the appearance of their site directly through their style.css page of the child theme. If it is the latter, any help finding a solution would be greatly appreciated.
2. Secondly, I’d like to make some changes to my site (here), specifically removing the “Text Size +/-” tool. I’d like to keep the “Call us at: #” text.
I believe I have removed the Text Size +/- from my style.css. I think I also accidentally removed the Call us at # text as well (which I’d like to keep). However, neither of these changes are showing up in my browser (or better or worse). If I have accidentally removed the “Call Us” CSS, I’d like to add it back.
Here is a copy of the header section of my style.css code for my child theme:
/* Image Header – Partial Width
———————————————————— */.header-image #title {
background: url(images/logo.png) no-repeat;
}.header-image #title-area {
margin: 10px 0 10px 10px;
}.header-image #title-area,
.header-image #title,
.header-image #title a {
display: block;
float: left;
height: 80px;
overflow: hidden;
padding: 0;
text-indent: -9999px;
width: 400px;
}.header-image #description {
display: block;
overflow: hidden;
}/* Image Header – Full Width
———————————————————— */.header-full-width #title-area {
float: left;
width: 50%;
}.header-full-width #title,
.header-full-width #title a {
width: 100%;
}/* Header / Primary / Secondary Navigation
———————————————————— */#nav {
margin: 0 auto;
width: 1200px;
}#nav .wrap {
border-radius: 8px;
background: #024e76;
padding: 0 10px;
}.menu-primary,
.menu-secondary,
#header .menu {
clear: both;
color: #FFF;
font-size: 17px;
font-weight: 400;
margin: 0 auto;
overflow: hidden;
width: 100%;
}#header .menu {
border: 1px solid #ddd;
box-sizing: border-box;
}.menu-primary {
border-bottom: 0;
}.menu-secondary {
border-bottom: 1px solid #ddd;
border-top: none;
}.menu-primary ul,
.menu-secondary ul,
#header .menu ul {
float: left;
width: 100%;
}.menu-primary li,
.menu-secondary li,
#header .menu li {
float: left;
list-style-type: none;
}.menu-primary a,
.menu-secondary a,
#header .menu a {
color: #FFF;
display: block;
padding: 7px 19px 6px;
position: relative;
text-decoration: none;
}.menu-primary li a:active,
.menu-primary li a:hover,
.menu-primary .current_page_item a,
.menu-primary .current-cat a,
.menu-primary .current-menu-item a,
.menu-secondary li a:active,
.menu-secondary li a:hover,
.menu-secondary .current_page_item a,
.menu-secondary .current-cat a,
.menu-secondary .current-menu-item a,
#header .menu li a:active,
#header .menu li a:hover,
#header .menu .current_page_item a,
#header .menu .current-cat a,
#header .menu .current-menu-item a {
background-color: #216589;
color: #FFF;
}.menu-primary li li a,
.menu-primary li li a:link,
.menu-primary li li a:visited,
.menu-secondary li li a,
.menu-secondary li li a:link,
.menu-secondary li li a:visited,
#header .menu li li a,
#header .menu li li a:link,
#header .menu li li a:visited {
border-top: none;
color: #FFF;
font-size: 12px;
padding: 9px 10px 8px;
position: relative;
text-transform: none;
width: 208px;
}.menu-primary li li a:active,
.menu-primary li li a:hover,
.menu-secondary li li a:active,
.menu-secondary li li a:hover,
#header .menu li li a:active,
#header .menu li li a:hover {
background-color: #196c97;
color: #FFF;
}.menu-primary li ul,
.menu-secondary li ul,
#header .menu li ul {
height: auto;
left: -9999px;
margin: 0 0 0 -1px;
position: absolute;
width: 228px;
z-index: 9999;
}.menu-primary li ul {
border-radius: 0 0 6px 6px;
background: #216589;
padding: 0 0 10px;
}.menu-primary li ul a,
.menu-secondary li ul a,
#header .menu li ul a {
width: 210px;
}.menu-primary li ul ul,
.menu-secondary li ul ul,
#header .menu li ul ul {
margin: -33px 0 0 228px;
}.menu li:hover ul ul,
.menu li.sfHover ul ul {
left: -9999px;
}.menu li:hover,
.menu li.sfHover {
position: static;
}ul.menu li:hover>ul,
ul.menu li.sfHover ul,
#header .menu li:hover>ul,
#header .menu li.sfHover ul {
left: auto;
}.menu-primary li a.sf-with-ul,
.menu-secondary li a.sf-with-ul,
#header .menu li a.sf-with-ul {
padding-right: 30px;
}.menu li a .sf-sub-indicator,
.menu li li a .sf-sub-indicator,
.menu li li li a .sf-sub-indicator {
background: url(images/icon-plus-white.png) no-repeat;
height: 16px;
position: absolute;
right: 4px;
text-indent: -9999px;
top: 10px;
width: 16px;
}.menu li a .sf-sub-indicator {
top: 13px;
}#wpadminbar li:hover ul ul {
left: 0;I’ve also added this header css to the Edit CSS Tab to improve spacing between the logo and main navigation bar:
/* Header
———————————————————— */
#header {
margin: 0 auto;
min-height: 100px;
overflow: hidden;
width: 1200px;
}#title-area {
float: left;
padding: 17px 0 65px;
overflow: hidden;
width: 400px;
background: url(http://www.ldancywebsitedesign.com/wp-content/uploads/2013/09/SECHCLOGO_2pms-Converted.png) no-repeat top left;
}Let me know of any suggestions you may have, and/or if I can provide additional information! Thanks in advance.
- The topic ‘Editing Child Theme CSS Does Not Produce Changes on Website’ is closed to new replies.