constrain header

header.tc-header {
  border-top: medium none;
  margin: 0 auto;
  max-width: 60%;
}

Play with the 60% to get what you want

I added that to the custom CSS and changed the value and am noticing nothing changing. I did delete the cache. Not sure what is wrong.

I also noticed when checking the page source that the max-width is already set to 50% for the above code on my site. How is it that it stretches all the way across the page. I don’t think this code does what you think I want it to do. I want the very top portion of my site to squeeze together so it’s not as long and approx. the same width as the content below it.

The container has a width of 1170px, so basicall instead of using max-width: 60%; you have to use width: 1170px;

Hey d4z.conf .. tHanks very much. Where do you see this information like the container max width? How do I get to it. Can I change that to make it a little wider? I don’t know the basics of how to get to the code!

Thanks very much.

Ken

That value is the width value of the class “container” you can see in each the skin (for example in customizr/inc/blue.css).
You can do whatever you want overriding the rules in your custom css or your child-theme style.css.
https://www.themesandco.com/customizr/how-to-customize-customizr-wordpress-theme/

I used this:

header.tc-header {
border-top: medium none;
margin: 0 auto;
max-width: 1170px;
}

in the custom css and it did nothing to the header…

.btn.btn-primary.fp-button:active,
.btn.btn-primary.fp-button.active {
  background-color: #b04d07 9;
/* CLOSING BRACE MISSING HERE */
header.tc-header {
  border-top: medium none;
  margin: 0 auto;
  max-width: 1170px;
}

Like This? (please explain as if you are explaining it to a total moron. ;0) )

.btn.btn-primary.fp-button:active,
.btn.btn-primary.fp-button.active {
background-color: #b04d07 9;
/*
*/
header.tc-header {
border-top: medium none;
margin: 0 auto;
max-width: 1170px;

…or better yet..Just show me what the code DOES look like as I would insert it please.

Maybe this…

.btn.btn-primary.fp-button:active,
.btn.btn-primary.fp-button.active {
background-color: #b04d07 9;
}
header.tc-header {
border-top: medium none;
margin: 0 auto;
max-width: 1170px;

Should be like this:

.btn.btn-primary.fp-button:active,
.btn.btn-primary.fp-button.active {
  background-color: #b04d07;
}
header.tc-header {
  border-top: medium none;
  margin: 0 auto;
  max-width: 1170px;
}

That worked! Thanks very much!