Simple help needed – page numbers alignment on events list

Ive managed to make it a bit larger, but still no joy being able to shoft it down, as the container it is in is only the height of the characters….

https://Www.carshow.life/events if that helps

HI,

Can you post the code / formatting you’re using?

Hi There

Here is the styling I am using on that page:

<ul style="float: left; width: 200px; padding: 10px; background: #fff; border: 1px solid #ddd; box-shadow: 0 0 5px #ddd; box-sizing: border-box; margin: 10px 10px 10px 10px;">
#_EVENTIMAGE{200,200}
#_EVENTLINK</br>
#_EVENTDATES</br>
#_LOCATIONNAME</br>
#_LOCATIONTOWN</br>
#_LOCATIONCOUNTRY
</ul>

But using the list means the page numbers don’t have a large container/table to sit under. Also, on smaller devices the events now stack nicely, so getting the numbers to be at the bottom has got be stuck!

You can’t use a ul tags in HTML without the corresponding li tags between them.

https://www.w3schools.com/html/tryit.asp?filename=tryhtml_lists_unordered

Thanks. Injust added the

• tags and it adds a nast bullet point in front of each item. Also the numbers to page through events still then sit at the top right.

Any ideas in how t get these under the events?

Understand this is more styling than plugin related, but if anyone can help…

Try this, it seems to work.

span.em-pagination {
    width: 100%;
    float: left;
}

Regards
Bill

Thank you!

I added 15px left padding so it starts aligned under the first event. Not as nice as having it sit centrally, but this means it works nicely on mobile when the events become stacked below each other, as the page numbers stay at the bottom of the events.

Thanks again!

Marking as resolved

Glad it helped, you can add:

text-align: center;

to center the text the way you want.

Regards
Bill

Thanks so much, all centred as well now. Simple stuff I just get stuck on. I played around with some centring after your post but couldn’t get it right, now it’s just how I was after.