|
anotheropus
|
February 10, 2017 at 5:51 pm
Hello,
On my Events page, there is a large gap above the Event dates.
How can I force the event dates to go up next to the View Details button?
Please see screenshot(s).
1. Before button click screenshot:
https://www.screencast.com/t/PkbnDWVH8
2. After button click screenshot:
https://www.screencast.com/t/6aeHsjHUC4jm
|
|
Josh
|
February 10, 2017 at 8:28 pm
Hi there,
You can add a bit of CSS and set a negative margin. Here’s an example:
.entry-content .event-datetimes {
width: 70%;
margin-top:-7em;
}
If you do not have a custom stylesheet to add the CSS to, you can add the CSS by clicking on “Customize” then add the CSS to the “Additional CSS” panel.
|
|
anotheropus
|
February 11, 2017 at 6:01 am
THANK You Josh! 🙂
It worked great.
And because 70% of our users are on mobile devices, and most of them are running at 360px width, I added a media query to our CSS, because the Add to Event Cart button overlapped part of the Show dates text.
/* Screen widths 476px and less
----------------------------------------------------------------------------- */
@media only screen and (max-width: 476px) {
/* Event Espresso adjust show dates position
----------------------------------------------------------------------------- */
/* ref https://eventespresso.com/topic/how-can-i-force-the-event-dates-to-go-up-next-to-the-view-details-button/ */
.entry-content .event-datetimes {
width: 100%;
margin-top:-3.25em;
}
}
|
