How to Increase Width of Events List

[Shaun]

Hello,

I am trying to increase the width of my Events List. As you can see in the screenshot, the list has a content wrapper set to a max width of 700px. When I change that to 100% in the Inspect tool, it becomes the proper size. But, when I paste the rule into my tribe-events.css file, it does not carry over.

Thanks for any assistance!
Mike

[Geoff B.]

Good evening Shaun and welcome back!

Thank you for reaching out to us.
I would love to help you with this topic.

The easiest way to tackle this is with CSS (as you already know).

In order for the rule to kick-in, you might have to add the !important argument after it.

For example:

.events-archive #tribe-events-content-wrapper {max-width:100% !important;}

Let me know if that helps.

Have a great day!

Geoff B.

[Shaun]

I just went through and tried what you wrote, including variations such as 1000px instead of 100%. Also tried with the exact code that was in the inspect tool with the important tag added. Still no luck. This is my first website so I might just be missing something obvious.

[Geoff B.]

Good afternoon Shaun,

I am sorry that the CSS code did not cut it for you.

So let’s dig a bit deeper.

As a first troubleshooting step, could you please provide us with your complete system information in a private reply using the instructions found in the following link?

https://theeventscalendar.com/knowledgebase/sharing-sys-info/

Could you also please send me a copy of the latest version of your WordPress theme / child theme via a link to a .zip file link (stored Dropbox or Google Drive) so that I can run some tests on my end ? I recommend a private reply for that purpose.

Please ensure you are using the latest files as found on your actual website.
This way I will get access to any updates or customizations you might have made.

Hang in there as we try to pinpoint where the issue is coming from.

Best regards,

Geoff B.

[Shaun]

This reply is private.

[Geoff B.]

Good evening Shaun,

I wish I could access your site to see for myself, but I think it is still in development.

With that in mind, I do have a copy of Jupiter 5.3, so I went ahead and ran a few tests.

I believe, you can get the result you are looking for by going to Events -> Settings -> Display and changing the Events template setting to Default Page template.

Let me know if that helps.

Have a great day!

Geoff B.

[Shaun]

Hmmmmm…

So switching to default page template did not fix the issue, but switching to Full Styles did to some extent. There are a few changes I’ll have to make as a result, but I should be able to work with it. Check out my attachment to see how wonkers the default page worked on my end.

Thanks,
Mike

[Geoff B.]

Hey Mike,

I am glad this helped out and that you are closer to your goal!

Let me know if you want me to pitch in with some CSS finishing touches.

Have a great day!

Geoff B.

[Shaun]

Do you have any suggestions or just general advice?

[Geoff B.]

Good evening Mike,

It looks like your test site is no longer available, but I would have recommended looking at the styling of your select elements.

Let me know how that goes.
And again, if you need a hand let me know, but I will need to be able to see the test site somehow 🙂

Best regards,
Geoff B.

[Shaun]

Cool.

Thanks Geoff

[Geoff B.]

Hey Mike,

Thank you for writing back.

I wish you a happy holiday season.

You are welcome back in our support forums any time 🙂

For now, I am going to close this thread.

Have a great week!

Geoff B.

[Author]

Posts