Docs

[ancinoleoboy]

Hello Team,

We were earlier using Global CSS editor in the customise section of the child theme to edit the CSS. We have removed CSS from there and placed it in the sytlesheet of the X- Child theme (integrity stack) however it does not work. I am on the latest wordpress and X-theme version.

Website address: https://goo.gl/TRbppZ

Kindly advise please.

Regards,
Ashish

[Joao]

Hi There,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

[ancinoleoboy]

This reply has been marked as private.

[Christopher]

Hi there,

The CSS is loading fine from style.css file, see the attachment.
Is there a specific code which doesn’t work?

Thanks.

[ancinoleoboy]

Hello there,

Child theme CSS is loading but the changes does not take effect from it however if I put it in Custom CSS in customiser then the changes happen.

Below are the changes that we need from the CSS:

.envira-gallery-wrap .envira-gallery-public .envira-gallery-item
img{padding:2px;}
.x-brand{float:left; max-width:25%;}
.x-brand img{width:65%;}

.envira-gallery-wrap{margin:0 auto;}
.envira-gallery-wrap .envira-gallery-public{margin:0px;}
p.resp-p.man{font-size:17px !important;}
h6, .h6{letter-spacing:0em;}
form#x-subscribe-form-1422.x-subscribe-form.x-subscribe-form-1422.center-block.mvn{width:auto !important;}
.x-subscribe-form input[type=”submit”]{margin-top:1.1em;}
fieldset{width: 30%;margin: 0 1%; float:left;}
.x-subscribe-form h1{text-align: center;margin: 0 0 1em 0;}
.x-btn, .button, [type=”submit”]{text-shadow:none;}
h1, .h1{font-size:320%;}
.x-btn:hover, .button:hover, [type=”submit”]:hover{text-shadow:none; background-color:#ff2b58;}
.envira-gallery-wrap .envira-gallery-public .envira-gallery-item img {width:100% !important;}

@media screen and (max-width: 1024px) and (min-width: 759px) {
.x-subscribe-form input[type=”submit”] { margin-top: 7%;}
.x-brand {max-width: 35%;}
}
@media screen and (max-width: 760px) and (min-width: 700px) {
.x-subscribe-form input[type=”submit”] {margin-top: 10%;}
.x-brand {max-width: 45%;}
}

@media screen and (max-width: 710px) and (min-width: 580px) {
.x-subscribe-form input[type=”submit”] {margin-top: 12%;}
.x-brand {max-width: 55%;}
}

@media screen and (max-width: 581px) and (min-width: 320px) {
fieldset { width: 100% !important;margin: 1% 0 !important;}
.x-brand {max-width: 70%;}
}
.x-slider-container.below{
border-bottom: none;
}
.x-navbar{background-color: #2b2c36;border-bottom:none;}
body.x-navbar-fixed-top-active .x-navbar-wrap{height:69px;}

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav>.current-menu-item>a{box-shadow:none;}
.desktop .sub-menu{background-color: #3b3c48;}

.x-colophon.bottom .x-nav li a{letter-spacing: 1px;}
a, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, .x-topbar .p-info a:hover, .x-breadcrumb-wrap a:hover, .widget ul li a:hover, .widget ol li a:hover, .widget.widget_text ul li a, .widget.widget_text ol li a, .widget_nav_menu .current-menu-item > a, .x-widgetbar .widget ul li a:hover, .x-accordion-heading .x-accordion-toggle:hover, .x-comment-author a:hover, .x-comment-time:hover, .x-recent-posts a:hover .h-recent-posts {
color: #ff2b58;
}
.x-btn:hover, .button:hover, [type=”submit”]:hover{background-color: hsl(347,87%,48%);}
.x-btn-navbar.collapsed{color: #ffffff;background-color: rgba(0, 0, 0, 0);
box-shadow: none;
text-shadow: none; }
.x-btn-navbar{color: #ffffff; background-color: rgba(0, 0, 0, 0); box-shadow:none; text-shadow:none; }
a.x-btn-navbar:hover {color: #ff2b58;background-color: rgba(0, 0, 0, 0); box-shadow:none;text-shadow:none; }
.x-btn-navbar, .x-btn-navbar.collapsed{font-size:27px;}
.x-btn-navbar.collapsed:hover {
color: #ff2b58;
background-color: rgba(0,0,0,0);
box-shadow: none;
text-shadow: none;
}
a.x-btn-navbar {
color: #ff2b58;
background-color: rgba(0, 0, 0, 0);
box-shadow: none;
text-shadow: none;
}

html {
overflow: visible !important;
}

[Paul R]

Hi,

It’s an issue with css selector specificity and priority.

It works in Custom CSS because it has a higher priority than your child theme’s style css.

If adding it in your child theme’s stylesheet, you need to add a selector with higher priority.

eg. Add body before each class

body .envira-gallery-wrap .envira-gallery-public .envira-gallery-item
img{padding:2px;}
body .x-brand{float:left; max-width:25%;}
body .x-brand img{width:65%;}

body .envira-gallery-wrap{margin:0 auto;}
body .envira-gallery-wrap .envira-gallery-public{margin:0px;}
body p.resp-p.man{font-size:17px !important;}
body h6, body .h6{letter-spacing:0em;}

….

http://stackoverflow.com/questions/4072365/css-understanding-the-selectors-priority-specificity

Hope that makes sense.

[ancinoleoboy]

I will try but it is a bit tricky for me.

[Jade]

Let us know how it goes.

[Author]

Posts