custom CSS not working since update to 3.5.1

[db3d]

I had several custom css that I’ve adjusted for my event page and now I can’t get any of the overrides to work.

[Barry]

I’m sorry to hear that. Which version did you update from and have you reviewed the Themer’s Guide to see what might have changed? Are there any specific examples of problems you can share?

[db3d]

I believe I had just 3.5. The way I figured it out previously was to add css to the tribe-events-pro-full.css in the resources location. So I added things like:

.single-tribe_events .tribe-events-event-image {
clear: both;
float: left;
text-align: left;
margin-bottom: 30px;
margin-right: 50px;
}

.single-tribe_events .tribe-events-content {
max-width: 450px;
float: left;
clear: left;
padding-right: 50px;
}

.single-tribe_events .tribe-events-event-meta {
font-size: 13px;
width: 450px;
overflow: auto;
}

.single-tribe_events #tribe-events-content form.cart, .single-tribe_events #tribe-events-content div.cart {
background: #fafafa;
border: 1px solid #eee;
margin: 30px 0;
padding: 0 4% 3%;
width: 400px;
overflow: auto;
}

table.tribe-events-tickets .tickets_price {
font-size: 22px;
font-weight: 500;
}

table.tribe-events-tickets {
margin: 0;
width: 100%;
border-bottom: 0;
text-align: left;
}

td.tickets_name {
color: #777;
font-size: 13px;
width: 100px;
}

td.tickets_description{
font-size: 11px;
}

.single-tribe_events .tribe-events-cal-links {
display: none;
}

.tribe-events-event-meta .tribe-events-meta-group, .tribe-events-event-meta .column {
float: left;
width: 50%;
padding: 0 4%;
text-align: left;
margin: 0 0 20px 0;
display: inline-block;
zoom: 1;
vertical-align: top;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

This gave me the 2 column look I was going for on the individual event page. http://db-3d.com/event/wdc-052014/

[Barry]

OK: editing core files like this is a sure way to lose changes when you update. What I’d recommend is setting things up via template overrides/custom stylesheets within your theme – our Themer’s Guide explains some of the best practices here.

Does that help?

[db3d]

Thanks Barry,

However, I am still having no luck. I’ve placed a .css file in the following location:
wp-content/themes/flawless-v1-15/tribe-events/pro/tribe-events-pro.css
I then added my previous modifications to the styles but this isn’t overriding the full styles css.

[Barry]

OK, if I can ask you to view the source of your custom stylesheet (it does seem to be being loaded in the expected order) you can see it contains a number of unusual elements (here is a short excerpt from the start):

{\rtf1\ansi\ansicpg1252\cocoartf1265\cocoasubrtf190
{\fonttbl\f0\fswiss\fcharset0 Helvetica;}
{\colortbl;\red255\green255\blue255;}
\margl1440\margr1440\vieww10800\viewh8400\viewkind0
\pard\tx720\tx1440\tx2160\tx2880\tx3600\tx4320\tx5040\tx5760\tx6480\tx7200\tx7920\tx8640\pardirnatural

\f0\fs24 \cf0 .tribe-events-before-html ul li, .tribe-events-after-html ul li, .tribe-events-before-html ol li, .tribe-events-after-html ol li, #tribe-events-pg-template .tribe-events-content ul li, #tribe-events-pg-template .tribe-events-content ol li \{\
margin: 0;\
line-height: 1.7;\
\}\
\

Could that be the result of whatever app you are using to edit these files and can you try revising this so it contains only valid CSS?

[db3d]

You are a life saver! I was editing the code using text edit on a mac….downloaded Brackets, made the changes and am now back up and running.
Thank you so much for your help!

[Barry]

No problem – happy to help!

As an aside, if you have a few minutes to spare and can leave us some feedback about your experiences so far with The Events Calendar we’d love to hear from you 🙂

Since this issue is solved I’ll go ahead and close the thread, but please don’t hesitate to create new ones if we can help with anything else.

[Author]

Posts