To center the header, find this code in your style.css:
#branding img {
border-bottom: 1px solid #000;
clear: both;
display: block;
}
and replace it with this code:
#branding img {
border-bottom: none;
clear: both;
display: block;
margin: 0 auto;
}
To run the black line across the entire white space, there are two parts of your CSS you need to modify.
FIRST find this code in your style.css file:
#wrapper {
background: #fff;
margin-top: 20px;
padding: 0 20px;
}
and replace it with this code:
#wrapper {
background: #fff;
margin-top: 20px;
padding: 0;
}
SECOND
#access {
background: #000;
display: block;
float: left;
margin: 0 auto;
width: 940px;
}
and replace it with this code:
#access {
background: #000;
display: block;
float: left;
margin: 0 auto;
width: 1020px;
}
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
@bethsoderberg Thank you for a detailed response, although you shouldn’t edit the theme’s files because:
– Your modifications will erase them the theme updates.
– Debugging becomes harder as you can’t distinguish between modified and original styles.
– You can compromise the theme.
– You’re more likely to have problems with CSS specificity.
To circumvent this, we recommend using a either a Custom CSS Manager plugin that contains your CSS in a separate section of the dashboard, or for more complex changes (including CSS) use a Child Theme.