CSS Help

Karessa used Ask the Experts™
Hi, I need some help tweaking some css on a wp theme. I'd like to add a container and image behind content but I'm not sure how to go about it, I think I"m on the right track but it doesn't align right.

The theme I am using is here

But I'd like to add the tiled image behind the slider images like this theme

The site I am working on is here (I've turned maintenance mode off so you can get to the site more easily)

You can see that when you resize the browser window the background image and the slider container don't align. I'd just like the background tile fixed and fill the screen no matter what size window somebody has open.

Thanks for your help, let me know if you need more info.
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Developer & EE Moderator
Fellow 2018
Most Valuable Expert 2013
The problem is the theme you purchased is not responsive.  In short the site that does resize uses media queries.  One example is

@media only screen and (min-width: 320px) {
    .pricing_box {
    border:2px solid #f4f4f4;
    padding:0 !important;

Open in new window

If you only spent $20 or $50 or even $100 on this theme, it would probably be easier to just get yourself a theme that is already responsive and uses media queries to adjust the css based on the viewport.  

The look and feel of your theme is common enough it will be easy to find a responsive version.  As a bonus, I would try and find one that uses bootstrap or foundation at it's core.  

If you want to continue with this theme and make it responsive, then you need to go through each page and decide how the layout should look for desktop, tab and phone.  Typically, there are 3 to 4 versions per page.  As example for the desktop you keep it as is, for a slightly smaller screen, you may keep the layout the same but make images, fonts and other objects smaller  As you get to a small or extra small screen you may decide to stack and/or hide elements.  It is not going to be a quick fix to do what you want.

If you didn't spend much money on this theme, using your time value, it will be easier and less expensive to just get one that is already responsive.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial