Add a separator in List View?

[karen]

I would like to add a separator in list view (aka LINE) to better distinguish between the events. How can this be done? I am using a skelaton style with a few tweeks. thanks

[George]

Hey @Karen,

Thanks for reaching out!

What you’re trying to do would require some code customization, which we unfortunately can only provide very limited support for, but to get started here, can you share a link to your Events List View?

I will take a look at it and recommend some CSS to add a bottom-border.

Thank you!
George

[karen]

http://southernarizonaguide.com/events

you will need to change the view.. does that work?
thanks!

[George]

Thanks Karen!

I took a look and would recommend adding CSS like this to the bottom of your theme’s style.css file:


#tribe-events-content .type-tribe_events {
border-bottom: 1px solid #999;
padding-bottom: 1em;
padding-top: 1em;
}


You will have to play around with the styles, change the colors to your needs and such, but I hope this is a helpful starting place. Here’s how that CSS makes things look on your site:

I will not be able to help with any further customization-related questions,
but I hope this helps! If you want to make further tweaks on your pages, definitely check out a [free!] tool like Firebug if you use FireFox, or the Developer Tools for either Safari or Chrome. They have “Inspector” tools that let you zoom right over the element whose styles you’d like to change, so you can see what CSS is required to make the changes you want to make.

Cheers,
George

[Support Droid]

This topic has not been active for quite some time and will now be closed.

If you still need assistance please simply open a new topic (linking to this one if necessary)
and one of the team will be only too happy to help.

[Author]

Posts