CSS에서 링크를 비활성화 할 수 있습니까?

Question

나는 이벤트 목록을 가지고 있으며, 어떤 이유로 그 목록의 첫 번째 이벤트 이름이 링크로 나타납니다. link_to 또는 a href 태그가 없으며 이벤트가 링크가되는 원인이 될 것이라고 생각할만한 것이 없습니다 ... 관련된 div 또는 스타일이 없습니다. 그래서 나는 그것이 비활성하게함으로써하지만 코드

.inactivate { 
    pointer-events: none; 
    cursor: default; 
} 

내 첫 번째 이벤트의 이름이 여전히 활성 링크로 표시

내 HTML

<% @events.each do |e| %> 
<div class="wrp"> 
<div class="otw"> 
<div class="edate"> 
<span class="strf"><%= e.created_at.strftime("%b").to_s %></span> 
<span class="strf"><%= e.created_at.strftime("%d").to_s %></span> 
<span class="strf"><%= e.created_at.strftime("%Y").to_s %></span> 
</div> 
<div class="otr"> 
<span class="inactivate"><%= e.name %></span> 
<%= link_to "Tables View", event_path(e)%> 
<%= link_to "Reservations", event_reservations_path(e)%> 
<%= link_to "Guestlist", event_guestlists_path(e)%> 
<%= link_to "Manage Inventory", event_path(e)%> 
<%= link_to "Promote", event_path(e)%><br> 

</div> 
</div> 
</div> 
<% end %> 

I와 순간의 문제를 마스크하는 것을 시도하고있다 스팬 클래스 "inactivate"를 사용하고 있지만 작동시키지 못합니다. 어떤 제안?

생성 된 HTML을

<div class="otw"> 
    <a href="events/new"> 
     <div class="edate"> 
      <span class="strf">Feb</span> 
      <span class="strf">02</span> 
      <span class="strf">2017</span> 
     </div> 
    </a> 
    <div class="otr"> 
     <a href="events/new"> 
      <span class="non">mjq wednesday</span> 
     </a> 
     <a href="/events/1">Tables View</a> 
     <a href="/events/1/reservations">Reservations</a> 
     <a href="/events/1/guestlists">Guestlist</a> 
     <a href="/events/1">Manage Inventory</a> 
     <a href="/events/1">Promote</a><br> 
    </div> 
</div> 

이고 그것은 a href="events/new"를 나타낸다. 내가 가지고있는 유일한 장소는 navbar에서 가지고있다.

<div> 
<ul class="uni"> 
    <li class="evn"><a class="active" href="#home">Home</a></li> 
    <li><div class="dropdown"> 
    <button class="dropbtn">Dropdown</button> 
    <div class="dropdown-content"> 
     <% @venus.each do |v| %> 
     <%= link_to v.name, venue_path(v) %> 
     <% end %> 
    </div> 
</li> 
    <li class="uli"><a href="#news">News</a></li> 
    <li class="uli"><a href="#contact">Contact</a></li> 
    <li class="uli"><a href="events/new">Add New Event</li> 
</ul> 
</div> 

그러나 두 개는 어쨌든 연결되어 있지 않다. 그 추한 솔루션입니다하지만, 작업을해야

Answer 1

같습니다 태그가 닫혀 있거나 페이지의 끝.

Answer 2

:

.inactivate { 
    pointer-events: none; 
    cursor: default; 
    text-decoration: none; 
    color: /* some common color */ 
} 
.inactivate:hover { 
    pointer-events: none; 
    cursor: default; 
    text-decoration: none; 
    color: /* some common color */ 
} 
.inactivate:active { 
    pointer-events: none; 
    cursor: default; 
    text-decoration: none; 
    color: /* some common color */ 
} 

코드의 모든 행 위 당신을 위해 정말 필요한 경우 결국 당신은 어쩌면이없는, 시도 할 수 있습니다. 까지

<li class="uli"><a href="events/new">Add New Event</li> 

이 내부의 앵커 태그를이 발생하는 각 블록 요소를 여러 번 렌더링 브라우저의 원인이 될 수있다 :이 라인에 닫는 앵커 태그 누락 수 같은