Move footer

[TomasJarvling]

Hi.
I am working on this page: copilates.se
I wonder where I can change the width of the footer to full width instead of having it slightly adjusted to the right.

[ruenel]

Hello @TomasJarvling,

Thanks for writing in! You are having this issue because you have imported the Law demo site. Please go to X > Theme Options > CSS and remove the custom CSS. If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site
​
To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[TomasJarvling]

Hi.
I can probably remove the css myself. But what css code should I look for?

[ruenel]

Hey @TomasJarvling,

It is this code that needs to be removed.

/*
// (min-width: 768px)
// ------------------
*/

@media (min-width: 768px) {
  .p-info span:first-child {
    float:left;
  }

  .p-info span:last-child {
    float: right; 
  }
}


/*
// (max-width: 979px)
// ------------------
*/

@media (max-width: 979px) {
  .x-brand {
    display: block;
	}

  .x-navbar {
    border-top: 3px solid #b9965c;
    
  }
}


/*
// (min-width: 980px) and (max-width: 1169px)
// ------------------------------------------
*/

@media (min-width: 980px) and (max-width: 1169px) {
  .site {
    padding-left: 3em;
    padding-right: 3em;
  }

  .x-force-full-width,
  .x-colophon {
    position: relative !important;
    left: calc(0vw - 3em);
    width: calc(100vw + 3em);
    padding-left: 3em !important;
    padding-right: 3em !important;
  }

  .no-right-padding {
    right: calc(0vw - 3em);
  }

  .site:before,
  .site:after {
    display: none;
  }
}


/*
// (min-width: 1048px)
// -------------------
*/

@media (min-width: 1048px) {
  .x-topbar .x-container .p-info { 
    position: absolute;
    top: 50px;
    right: 0;
    width: 450px;
  }
}


/*
// (min-width: 1170px)
// -------------------
// 01. Should match with max width from Theme Options >
//     Layout and Design + 115px. Current max-width: 1055px +
//     115px (a space for header and footer to bleed out) = 1170px.
// 02. 107px value comes from final output width of logo on site
//     (e.g. original is 214px but halved for retina support).
*/

@media (min-width: 1170px) { /* 01 */
  .site {
    padding-left: calc((50vw - (1170px / 2)) + 1em);
    padding-right: 3em;
  }

  .x-force-full-width,
  .x-colophon {
    position: relative !important;
    left: calc(0vw - ((50vw - (1170px / 2) + 1em)));
    width: calc(100vw + 3em);
    padding-left: calc((50vw - (1170px / 2)) + 1em) !important;
  }

  .x-force-full-width.x-padded,
  .x-colophon {
    padding-left: calc((47.5vw - (1170px / 2)) + 1em) !important;
  }
  
  .x-force-full-width.x-rtl {
    padding-left: 0 !important;
    padding-right: calc((47.5vw - (1170px / 2)) + 1em) !important;
  }

  .no-right-padding {
    right: calc(0vw - 3em);
  }

  .site:before,
  .site:after {
    left: calc(((49vw - (1170px / 2)) - (107px + 2vw)) + 1em); /* 02 */
  }

  .site > .x-container.max {
    margin-left: 0px;
  }

  .blog .site > .x-container.max,
  .blog .site > .x-header-landmark {
    margin-left: 0px;
    padding-left: 1em;
  	padding-right: 1em;
  }
}


/*
// (max-width: 1440px)
// -------------------
// Hide spacer background arrow. Could be done for each section's CSS
// but it is present on all pages so custom CSS is more useful and reusable.
*/

@media ( max-width: 1440px) {
  .head_spacer .x-bg {
    display: none;
  } 
}


/*
// (min-width: 1340px)
// -------------------
// 01. Background logo positioning for very large screens.
// 02. Dimensions should match logo used in Theme Options. Original logo
//     is 214x48 but halved for retina display support.
// 03. Logo is rotated and then translate value should be adjusted to suit.
*/

@media (min-width: 1441px) { /* 01 */
  
  .site:before {
    top: 0;
    transform: rotate(-90deg) translate(-87%, 0); /* 03 */
  }

  .site:after {
    bottom: 6em;
    transform: rotate(-90deg) translate(36%, 0); /* 03 */
  }
}

Anyways, I went ahead and remove it already. Check your homepage now.

[TomasJarvling]

Thank you so much:)

[ruenel]

You`re most welcome.