Increase sitecontainer width

[mikehaynes]

All, 

Any code snippets to share when it comes to expanding the width of the site container and footer?

<style>
#siteContainer {
max-width: 1300px
}
</style>


Has gotten me my desired result with the siteContainer. I can't figure out the footer. 

Any and all help is appreciated. 
Mike

[docnzok]

Hey Mike,

 

Finally an easy question on the Code Forums.

 

.snFooterContainer {

max-width: 1300px

}

 

You have to add this one separately because they use the "siteContainer" as an ID and they use the "snFooterContainer" as a CLASS.

 

Otherwise I would put them both on the same line.

 

The reason they use the container as a class is that each container may have a different class (i.e. 2 across, 3 across, and the different %'s across like 25%, 75%)

 

Remember unless you are only doing the one page, make sure that you put that in Cascading to ensure it hits all the pages below.

 

And if you want to use it throughout the site, you have to put that style on each root page.

 

Hope that helps.

 

Mark

[mikehaynes]

Thanks Mark, 

The difference between "." and "#" changed things for me. 

 

[jmarcus]

The below code has worked on previous sites but not with the Hockey Club theme. 

 

https://www.qcaabasketball.com/

 

 

<style>

#siteContainer {

max-width: 1300px

}

</style>

 

What is the code to increase the container on this website? 

[SportsEngine Staffer]

You're on Version 3 of our website layout.  Version 4 provides you simpler experience when utilizing inspection tools and adapting the head code (at your own risk). 

 

Since V3 is not mobile responsive (it's fixed width), it was designed to appear on a standard 13-15" computer screen.  Widening out your content might result in an unwanted view size with your clientele. 

 

That was the disclaimer - to do what you want you'll want to tweak this head code:

 

 

<style>
#siteHeader {
background-position: center;
}
.siteContainer {
width: 1290px;
}
#siteContainer2 #panelTwo {
width: 1100px;
}
#topNav table {
width:100%
}
 </style>