Indenting/Padding Blog Posts and Widgets – Lifestyle Pro

Community Forums Forums Design Tips and Tricks Indenting/Padding Blog Posts and Widgets – Lifestyle Pro

This topic is: not resolved

This topic contains 1 reply, has 2 voices, and was last updated by  Sridhar Katakam 7 months, 2 weeks ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #78839

    julie@juliegalbraith.com
    Member
    Post count: 1

    I have changed my .site-container so that the header spans the entire page with no padding top or left and right. However, in setting the padding to 0 in the .site-container – all post boxes and widget boxes are now flush with the edge. How do I change the padding of them?

    Here is the site http://www.travellingfortwo.com

    Here is the code I changed in the .site-container

    .site-container {
    background-color: #FFFCF3;
    box-shadow: 0 0 5px #194F7C;
    margin: 32px auto;
    margin: 3.2rem auto;
    max-width: 1140px;
    overflow: hidden;
    padding: 36px;
    padding: 0px;
    }

    http://www.travellingfortwo.com
    #78993

    Sridhar Katakam
    Participant
    Post count: 923

    Try this CSS:

    .site-container {
    	padding: 36px;
    	padding: 3.6rem;
    }
    
    .site-header {
        margin-left: -3.6rem;
        margin-right: -3.6rem;
        margin-top: -3.6rem;
    }
    
    .nav-secondary {
        margin-left: -3.6rem;
        margin-right: -3.6rem;
    }
    
    @media only screen and (max-width: 1023px) {
    
    	.site-header {
    		padding: 0;
    	}
    
    }

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.