SKT Full Width Pro – Footer and Footer bottom misalignment

[MP EK]

There is a misalignment with the areas:

Content, lower widget area (footer), and footer bottom

I’d like to know where to change these settings?

It is misaligned in responsive view as well, please see second screenshot.

[Sonl Sinha]

Hi Michael,

Kindly show us your website URL.

Regards,
Brad

[Sonl Sinha]

Hi Machael,

Add this code in custom css box:

#content, .footer-bottom { width:100%;}
@media screen and (max-width:767px) {
#secondary.home_front_wrap { margin-bottom:20px;}
#primary { width:100%; margin:0;}
#content, .header { width:90%; margin:auto;}
#colophon, .footer-bottom { width:90%; margin:auto;}
.footer-bottom { width:90%;}
}

Regards,
Dave

[MP EK]

Worked! Thank you.

[MP EK]

The new alignment doesn’t work on “full width” page template, please check this page

[Sonl Sinha]

Hi,

Add this code in custom css box:

@media screen and (max-width:767px) {
.page-template-page-full-width-php .footer-bottom{width:90% !important;}
}

Regards,
Dave

[MP EK]

Thank you for your answer.

I added the new code = it does not work
I deleted the old code (above) = it does not work
I put back in the old code = it does not work

What now?

[Sonl Sinha]

Hi Michael,

Alignment is fine now. We have just checked on different browsers.

Regards,
Dave

[MP EK]

Well, not on every page, please have a look here, cklick on “News 2”:

http://pekic.de/das/news-2/

[Sonl Sinha]

Okay add this code in custom css box:

.page-template-page-full-width-php .footer-bottom{width:100% !important;}

Regards,
Dave

[MP EK]

The footer is misaligned again!

These are the custom codes you/SKT gave me:

#content, .footer-bottom { width:100%;}
@media screen and (max-width:767px) {
#secondary.home_front_wrap { margin-bottom:20px;}
#primary { width:100%; margin:0;}
#content, .header { width:90%; margin:auto;}
#colophon, .footer-bottom { width:90%; margin:auto;}
.footer-bottom { width:90%;}
}
.page-template-page-full-width-php .footer-bottom{width:100% !important;}

@media screen and (max-width: 479px) {
#secondary.home_front_wrap{margin-bottom:0 !important;}
}

@media screen and (max-width:767px) {
.page-template-page-full-width-php .footer-bottom{width:90% !important;}
}

.single-post h1.entry-title{color:#dc266e !important;}
.single-post h1.entry-title{line-height:35px !important;}
.post-thumb img{border:none !important;}
.post-thumb img{border-radius:0 !important;}

.header .logo{ padding:60px 0 0 !important;}
#site-nav ul li{border-bottom:1px solid #dc266e !important; border-top:none !important;}

.postmeta{display:none;}

.homepage-article{ width:250px !important;}
.category article{ background:#FFF !important;}
.homepage-article h1.entry-title{border-top:none !important;}
.homepage-article h1.entry-title a{color:#dc266e !important;}
.homepage-article h1.entry-title a:hover, .category h1.entry-title:hover::first-letter{color:#fff !important;}
h1.entry-title{ line-height:11px !important; text-align:left !important;}

h2.widget-title{color:#dc266e !important;}

[Sonl Sinha]

Hi Michael,

Kindly go to Appereance>>Theme Option>>Basic Setting>>Custom CSS Box

Add this code there:

#colophon{width:100%;}

Regards,
Brad

[Author]

Posts