Eventbrite Multi event Theme increase width of image column

tonydrewertrump · Member · Jul 12, 2016 at 8:46 pm
Copy link

Add topic to favorites
HI I am looking for some help to increase the width of the event image column in relation to the text column in the eventbrite multi event theme we have the CSS option

Site is https://artsforhungerfordevents.wordpress.com

Many thanks for any help

The blog I need help with is: (visible only to logged in users)
tonydrewertrump · Member · Jul 12, 2016 at 9:02 pm
Copy link
Note this only applies when the more information link is taken and the event is shown full page

Works is more information and scroll down in window
thesacredpath · Member · Jul 12, 2016 at 9:18 pm
Copy link
Hi there, are you wanting to change the image width on the single event pages at Eventbrite, such as this one: https://www.eventbrite.co.uk/e/the-revenant-tickets-26503901884?ref=wpevent ?
tonydrewertrump · Member · Jul 12, 2016 at 10:01 pm
Copy link
Hi tsk for the response no on this one https://artsforhungerfordevents.wordpress.com

Hope you can help
thesacredpath · Member · Jul 13, 2016 at 2:51 am
Copy link
Thanks. So you are talking about if I click on the Read More link on say, The Revenant and go to this page https://artsforhungerfordevents.wordpress.com/events/26503901884/, correct? How much wider do you want the image? The reason I’m asking is that the space for the text beside the image (date/time/title) changes depending on the width of the browser window/device screen it is viewed on.
tonydrewertrump · Member · Jul 13, 2016 at 7:12 am
Copy link
Hi no just on the opening listings page want to increase the size of the image column probably by 10 or 15% and reduce the size of the event text description
May need a slightly deeper row height per event but may leave this and let people click for more info
thesacredpath · Member · Jul 14, 2016 at 8:47 pm
Copy link
Hi, I looked at the CSS, and the image sizes have a couple of breakpoints and to keep things from getting messed up on some ranges of screen sizes, I’ve constructed a couple of Media Queries. Add the following to your custom CSS and see what you think.
```
@media screen and (min-width: 980px) {
  .home .event-image {
    width: 200px;
  }
}
@media screen and (min-width: 769px) and (max-width: 979px) {
  .home .event-image {
    width: 140px;
  }
}
```
I increased image widths by about 15%. You can play with the 200px and 140px values and see what numbers work for you.
tonydrewertrump · Member · Jul 15, 2016 at 5:40 pm
Copy link
Many thanks this work well

Thank you for your time
thesacredpath · Member · Jul 16, 2016 at 7:00 pm
Copy link
Hooray and you are welcome!

No items found.