Events and News Widget: Empty <ul> Appears Without City Selection Causing Layout Shift

[dvpatel]

When no city is selected in the WordPress Dashboard's "Events and News" widget, an empty <ul> element is still rendered. This causes an unnecessary blank space, resulting in a two-line display where only one is expected. Ideally, the <ul> should not be rendered unless actual event content exists.

[dvpatel]

Created patch.

[dvpatel]

After Patch

Reduce margin to remove extra space in Events and News widget

Instead of removing the empty <ul>, this approach reduces the bottom margin, ensuring that the widget maintains a clean, single-line display without affecting layout when events are present.

Trac ticket: https://core.trac.wordpress.org/ticket/63465

[sabernhardt]

The 6px bottom margin was added in [55889] for the Activity widget, but it also appears for the first .activity-block element in the Events and News widget. That changeset also assigned a zero margin for the :last-child.

If those two changes should be undone, the Activity widget spacing could still work with a rule like this:

#activity-widget .activity-block + .activity-block {
	margin-top: 6px;
}

In my site, I did not have an empty ul, however. The events list included an event-none list item with "There are no events scheduled near you at the moment. Would you like to organize a WordPress event?"

[sabernhardt]

event-none list item in the widget (WordPress 6.8.1, not patched)

[ankitkumarshah]

Hi @dvpatel,
I also tried to reproduce the issue, but as mentioned by @sabernhardt, I was unable to find any empty ul tag instead, I got the following:

<ul class="community-events-results activity-block last" aria-hidden="false">
  <li class="event-none">			  
    There are no events scheduled near None at the moment. Would you like to <a href="https://make.wordpress.org/community/handbook/meetup-organizer/welcome/">organize a WordPress event</a>?
  </li>
</ul>