responsive calender widget

[Birgit Bauer]

Hello,

I am using the calender widget in my sidebar. But for any reason the width doesn’t fit into the sidebar.
On my desktop PC the width is shown without the normal padding and on the left side it doesn’t line up with the date symbols:
http://screencast.com/t/XOWJ1Zziwvfh

Also on tablets and smartphones it “goes outside the screen”.

Here is a screenshot from an iphone:
http://screencast.com/t/2g0nqooOPSP

How can I fix it?

Thank you

[Brook]

Howdy Birgit,

I would love to help you with this. Without being able to examine the webpage in question I can only guess as to a solution. But adding this CSS might help things shrink:

.table.tribe-mini-calendar td, table.tribe-mini-calendar th { padding: 0; }

Does that all make sense? Does that work? If not, can you share a link to the page with this issue?

Cheers!

– Brook

[Birgit Bauer]

This reply is private.

[Brook]

Thanks for sharing the link. For your theme this is the CSS I’d use:

.tribe-mini-calendar-grid-wrapper table.tribe-mini-calendar { border-collapse: collapse; }

.tribe-mini-calendar-grid-wrapper table.tribe-mini-calendar td, .tribe-mini-calendar-grid-wrapper table.tribe-mini-calendar th { padding: 5px 0; }

That do what you wanted?

• Brook

[Birgit Bauer]

Hello Brook,

works .. nice Thank you!

[Brook]

Excellente! Let us know if you ever need anything else.

• Brook

[Author]

Posts