Eddie Vartanessian Eddie Vartanessian - 1 year ago 82
CSS Question

WordPress Theme Oddity

I have applied a theme called Karma to my WordPress instance and there is an issue (which they deny) that I've had for awhile now and just can't seem to figure out with its CSS.

The problem is that my website, www.LiveCarePC.com is a responsive site. When it resizes for mobile or a tablet, .jqslider seems to fail to resize itself properly. It just becomes a gray bar that bothers you.

Desktop view:

enter image description here

Mobile View:

enter image description here

Karma Theme Mobile View (Live Preview on http://themes.truethemes.net/Karma/homepage-jquery-2-2):

enter image description here

Any help would GREATLY be appreciated. You can inspect the site and see its source there, obviously.

*Note: I've reinstalled Wordpress and the theme itself as well as all the plugins so it's not that. I'm just looking for the solution in the code.

Answer Source

For anyone else running into this error, it seems it's a bug in one of the css files. Below is the fix.

In the karma-royal-blue.css file, you must comment out one of the lines as seen below.

#header .header-holder {background:#182947 url(../images/skins/karma-royal-blue/bg-header-holder.jpg) 0 0 repeat-x !important;} 

/* .big-banner #header .header-holder {background:#182947 url(../images/skins/karma-royal-blue/bg-big-header-holder.png) 0 0 repeat-x !important;} */

.top-block {background:#13223C !important;}

The line that's commented out is the line that, well, needs to be commented out. That fixes the error.

This fix applies to the Royal Blue color scheme in the Karma Wordpress theme. It may apply to others as well.