I have a template where I am displaying each event as a card and the elements of the cards either have links or not. For links to other routes, I am using the `link-to` helper but it is breaking the Semantic UI card layout. <https://semantic-ui.com/views/card.html>

The card perfectly fine if I remove the link-to tags. Am I missing something here or is there a better way of doing this? 
The code is as follows:

```
<div
class="ui card {{unless isWide 'event fluid' 'thirteen wide computer ten wide tablet sixteen wide mobile column'}}">
{{#unless isWide}}
  {{#link-to 'public' event.identifier}}
    <div class="ui fluid image">
      {{widgets/safe-image src=(if event.originalImageUrl event.originalImageUrl event.originalImageUrl)}}
    </div>
  {{/link-to}}
{{/unless}}
{{#link-to 'public' event.identifier}}
  <div class="ui main content">
    {{#smart-overflow class='header'}}
      {{event.name}}
    {{/smart-overflow}}
    <div class="meta">
      <span class="date">
        {{moment-format event.startsAt 'ddd, MMM DD h:mm A'}}
      </span>
    </div>
    {{#smart-overflow class='description'}}
      {{event.shortLocationName}}
    {{/smart-overflow}}
  </div>
{{/link-to}}
<div class="extra content small text">
  <span class="right floated">
    <i role="button" class="share alternate link icon" {{action shareEvent event}}></i>
  </span>
  <span>
    {{#if hasBlock}}
      {{yield}}
    {{else}}
      {{#each tags as |tag|}}
        <a>{{tag}}</a>
      {{/each}}
    {{/if}}
  </span>
</div>

```