• How do I fix my footer on static front page that has absolutely no left margin and no padding?

    Also, when I resize the window, all of the content on the front page has no left margin and no padding. What CSS do I need to change or add to fix this?

    Other than the style.css file in my child theme, the following code is in Appearance>Customize>Additional CSS
    div .wrap {
    max-width: 100%;
    }
    But I don’t think that did anything when I was testing it.

    Below, please find the code in the style.css file I created when I made the child theme.

    Any suggestions or help? Thanks!

    I created a child theme and have a style.css file with the following code:
    Theme Name: Tara’s twentyseventeen: Child Theme
    Theme URI:
    Description:
    Author: Tara Hollander
    Author URI: https://tarahollander.com/portfolio
    Template: twentyseventeen
    Version: 0.1.0
    */
    @import url(“../twentyseventeen/style.css”);

    /*.site-content-contain {
    background-color: gray;
    }*/
    /*body.page-template-page-full-width #primary .page-full-width*/

    @media screen and (min-width: 48em) {
    body.page-template-page-full-width .page-full-width #primary .entry-content {
    width: 100%;
    }

    body.page-template-page-full-width .page-full-width #primary .entry-header {
    width: 100%;
    }
    }
    body.page-template-page-full-width #primary .entry-header .entry-title {
    font-size: 2.75rem;
    font-size: 40px;
    }

    @media screen and (min-width: 48em) {
    body.page-template-page-full-width #primary .entry-header .entry-title {
    font-size: 3.5rem;
    font-size: 60px;
    }
    }

    /* Reduce white space */
    .twentyseventeen-front-page .panel-content .wrap,
    .site-footer .wrap {
    padding: 0;
    }

    .site-footer .widget-area {
    padding-bottom: 0;
    }

    .site-footer {
    margin-top: 0;
    }

    /* Footer styling */

    .site-footer {
    border-top: 1px solid #eee;
    }

    .site-footer .wrap {
    padding-bottom: .75em;
    padding-top: .5em;
    }

    /* Footer widgets */

    .site-footer .widget-area {
    padding-bottom: 0em;
    padding-top: .5em;
    }

    .navigation-top {
    background-color: #C6A45A;
    }

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Use this:

    @media screen and (min-width: 48em){
    	.site-footer .widget-column.footer-widget-1 {
    		margin-left: .7em;
    	}
    }
    
    @media screen and (min-width: 48em){
    	.site-info {
    		margin-left: 0.7em;
    	}
    }

    You don’t need left padding as it would changes the vertical alignment of site info and first widget
    Or you could apply it everywhere:

    .site-footer .widget-column.footer-widget-1 {
    	margin-left: .7em;
    }
    
    .site-info {
    	margin-left: 0.7em;
    }
    

    I have a good reason to believe `div.wrap{max-width:100%;} has changed the left margin to 0

Viewing 1 replies (of 1 total)
  • The topic ‘How to fix no footer left margin or padding?’ is closed to new replies.