[BKvalvikParticipant]

Hi,

I’d like to make a few small CSS changes to my site — mandarinhq.com — and have a few questions:

1. What is the hex value for the light grey dividers used between the posts on the blog index page?
2. What’s the best way to add an additional 10 px space between the content and the navbar?
3. What’s the best way to add an additional 10 px space between the content and the sidebar?
4. Is it possible to remove the white space and divider above the first post on the blog index page? (see image)

Thanks!

B

[ChristianModerator]

Hey B,

1. The value is not in HEX but RGBA rgba(0,0,0,0.1) (see attachment). The HEX conversion of it would be #E6E6E6
2. Please add the code below in your Appearance > Customize > Custom > CSS.

.x-container>.offset {
    margin: 45px auto 35px;
}

3. Column layout modification requires custom development which regretfully falls outside the scope of our support.

4. Please add the code below in your Appearance > Customize > Custom > CSS.

.blog .x-main .post:first-child {
    border-top: 0;
    padding-top: 0;
}

Hope that helps. 🙂

[BKvalvikParticipant]

Thanks! It all worked except for point #2.

For point #2, there was no effect when I put that code in the customiser. Could the reason for that be that there’s something else in the customizer that prevents it from taking effect? Here’s what I have in the customizer:

.site {background: #f5f5f5;}

.x-main {background-color: #ffffff;}

.entry-wrap { padding: 0 35px; }
#comments {
margin: 35px;
padding-bottom: 1px;}

.page-id-90 .entry-wrap {
padding: 0;}
.x-main.left {
padding-right: 0;}

.x-full-width-layout-active.x-content-sidebar-active a.entry-thumb.featured, .page .x-main.left .hentry .entry-featured, .single-post .x-main.left .hentry .entry-featured { margin-right: 0;}

.blog .x-main .hentry.has-post-thumbnail>.entry-wrap, .search .x-main .hentry.has-post-thumbnail>.entry-wrap, .archive .x-main .hentry.has-post-thumbnail>.entry-wrap {
padding: 10px !important;
text-align: justify;}

.single-post .x-main.left .hentry .entry-featured {
margin-top: 0px;
}

.x-colophon.top {
background-color: #ffffff;
}
/* Mobile nav button background color */
.x-btn-navbar, .x-btn-navbar.collapsed{
background-color:#fff!important;
}
/* Hamburger lines color */
.x-btn-navbar, .x-btn-navbar.collapsed i{
color:#000!important;
}

/* hover and current item background and text color */
.x-navbar .x-navbar-inner .x-nav-collapse .x-nav > li > a:hover,
.x-navbar .x-navbar-inner .x-nav-collapse .x-nav .current-menu-item > a{
background-color:#fff!important;
color:#000!important;}

.site .x-nav-articles {
display: none;
}

[ChristianModerator]

No. But, there might be a syntax error in your CSS which prevented the code from being loaded (see attachment). Please check for syntax errors usually unclosed or missing ending bracket }

Thanks.

[Author]

Posts