Background problems

[Dirk]

Hi guys,

I think some other folks had some issues with this and for most part I figured how to solve it. I have one question though.

When you look at the website (see the link provided) you notice that there is a white background thanks to this piece of code:

#tribe-events-pg-template {
    background: #fff;
    padding: 20px;
}

As you can see the body of the event calendar stuff is less width then body of the rest of the website. I could fix this by just adding more padding but then it look hideous on small screen devices like smartphones.

So the question:
Is there a way to increase the width of the events calendar pages? I think that would solve the problem. (For the future, I think this could be fixed to have theme pages with events calendar shortcodes 😉 )

Thanks in advance

[George]

Hey Dirk,

That bit of code you posted is coming from your Child Theme, and the odd width disparity on your page is coming from the structure and styling of your child theme as well.

We cannot technically offer support for customizations, but this one on your site should fortunately be pretty simple to resolve. Try adding the following CSS to the bottom of your child theme’s style.css file:

.tribe-events-page-template #et-main-area {
    background: #fff;
}

Let us know if this helps! For further theme style tweaks, I’d definitely recommend getting a tool like Firebug if you use FireFox, or the Developer Tools for either Safari or Chrome – they’re all free and have some great features that make writing custom CSS like I did here very easy!

Cheers,
George

[Elizabeth]

Hi,

I installed your Events Calendar PRO yesterday. Right out of the box and ONLY on the Chrome browser The background on the individual events page and n the calendar view page the background is missing.

In Safari, Firefox and IE is the correct background but 100% Chrome browser there is no background image. Which causes and issue because is dark text on a dark background.

I installed the code listed above in the style.css file but unfortunately still no win with Chrome browser.

We are running on the WP Divi Theme all updated. Your plugin is the first plugin I installed on the theme so I know that there is no theme conflict.

Below are my two sample pages.
http://stayclassyarizona.com/event/blank-space-dinner-series/

The calendar page it’s self is not bad with the current dark background. SO if you could just provide me the code to add that will force the issue within the Chrome browser for the above individual events that would be great!

Many Thanks ahead of time!!

-E
http://stayclassyarizona.com/events/

[Dirk]

Hi George,

Thank you for comming back to me on this.

The code I provided was something I put in there. As a result of some searches on the Tribe forums.
I knew the width couldn’t have caused by the theme since every page had correct width except the tribe pages.

But, when I swapped my lines of code by yours it works perfectly!

I’m also running Divi theme, in child, and the background showed on every page. I didn’t want this because of readability so I wanted a white background.

Thank you for your support! 🙂

[George]

Hi Elizabeth,

Your issue is a bit different than Dirk’s here, and since Dirk’s issue is resolved, I will close up this ticket. Can you open a new ticket with a description of your issue, and also possibly some screenshots of the exact difference you notice between Firefox/IE and Chrome? I checked out both of your links in different browsers and was not able to spot a difference in style in Chrome compared to any other browser.

Thanks!
George

[George]

Hey Dirk,

Glad to hear your issues are fixed! I’ve gone ahead and closed this ticket for now, but if other issues or questions arise, come back and open a new ticket any time.

Cheers!
George

[Author]

Posts