scss 使用flexblox的页脚小部件

Posted 2021-05-17

.footer-widgets {
	@include breakpoint(tablet) {
		display: -webkit-box;
	    display: -ms-flexbox;
	    display: flex;
	    -ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	    margin-right: -3rem;
	}
    

    .widget {
    	width:100%;
    	border-bottom:1px solid $white;
    	padding-bottom:1.5rem;

    	@include breakpoint(tablet) {
		    width: 25%;
		    padding-right: 1.5rem;
		    margin-right:1.5rem;
		    box-sizing: border-box;
		    -webkit-flex-grow: 1;
		    flex-grow: 1;
		    border-right: 1px solid $white;
		    border-bottom:0;
    		padding-bottom:0;

		    &:last-of-type {
		    	border-right:none;
		    }
		}
	}
}