Replies: 0
If you view my home page it is all skewed to the left with a big white panel down the right-hand side.
1)Previously it has been all on the left and I would like to know how to center it.
2)The white panel down the right has appeared today after following the top set of instructions from this page: https://wordpress.org/support/topic/twenty-seventeen-how-to-get-sidebar-on-pages/
My home page is http://www.piwakawakavalley.com
My current custom css is
/*
You can add your own CSS here.
Click the help icon above to learn more.*/
.single-featured-image-header img {
/* display: block; */
/* margin: auto; */
max-height: 300px;
width: auto;
}
.navigation-top .wrap {
max-width: 100%;
/* padding: 0; */
}
@media screen and (min-width: 48em) {
.navigation-top .wrap {
max-width: 100%;
/* padding: 0.75em 3.4166666666667em; */
}
.custom-logo-link img, body.home.title-tagline-hidden.has-header-image .custom-logo-link img, body.home.title-tagline-hidden.has-header-video .custom-logo-link img {max-width: 60%; max-height: 80%;}
}
/* Mobile view*/
.panel-image {
/*background-position: center center;*/
/*background-repeat: no-repeat;*/
/*-webkit-background-size: cover;*/
/*background-size: cover;*/
/*position: relative;*/
height: 25vh;
}
/*Full screen laptop/computer screen view*/
@media screen and (min-width: 48em) {
.panel-image {
/*height: 100vh;*/
height: 40vh;
/*max-height: 1200px;*/
}
}
.archive .page-header h1.page-title {
display:none !important;
}
.page-header {display: none !important;
}
.page #content {
max-width: 100%;
padding-top: 13px !important;
}
.page .entry-header {
display: none !important;
}
.site-content {
padding: 0 0 0;
}
.twentyseventeen-front-page .panel-content .wrap,
.site-footer .wrap {
max-width: 90%;
padding: 1em;
}
.site-footer .widget-area {
padding-bottom: 0;
}
.site-footer {
margin-top: 0;
}
.blog .content-area, .search .content-area {
max-width: 1000px;
}
@media screen and (min-width: 48em) {
.blog:not(.has-sidebar) #primary article,
.archive:not(.page-one-column):not(.has-sidebar) #primary article,
.search:not(.has-sidebar) #primary article,
.navigation.pagination,
body.blog .site-content .page-header,
body.archive .site-content .page-header,
body.search .site-content .page-header {
float: none;
margin-left: auto;
margin-right: auto;
max-width: 500px;
width: auto;
}}
@media screen and (min-width: 70em) {
.entry-content {width: 120vh}
.wrap {
max-width: 100%;
padding-left: 3em;
padding-right: .5em;
}
}
I am sorry if this is messy/not the best way of doing these things – my knowledge is limited on these things.
Any suggestions on 1) centering the front page text and 2) sorting out that white space?