div에 링크가 표시되지 않지만 버튼이

이 문제로 인해 몇 시간 동안 완전히 멈추었습니다. div container에는 동적으로 생성 된 프래그먼트가 링크 button 앞에 삽입되어 있습니다. 그러나 링크가 표시되지 않습니다. 링크를 <input type="image"> 또는 <input type="button">으로 변경하면 표시됩니다. 내가 링크를 표시 할 수있는 유일한 방법은 절대 위치 지정을 사용하는 것입니다.div에 링크가 표시되지 않지만 버튼이

이것은 HTML

<div id="container"> 
    <a href="#" id="button" onClick="function();"></a> 
</div>

이며,이 내 CSS입니다

#container { 
    display: none; 
    background: url(../img/background.png) top left repeat; 
    text-align: center; 
    padding-top: 55px; 
    padding-bottom: 68px; 
    width: 100%; 
} 

#button { 
    margin: 10px; 
    width: auto; 
    height: 40px; 
    background: url(../img/button.png) no-repeat bottom; 
    background-size: 100% 100%; 
} 

#button:hover { 
    background: url(../img/buttonpress.png) no-repeat bottom; 
}

사람이 원인이 될 수 무엇을 알고 있나요?

출처

2013-09-07 Denman

jsfiddle을 (를) 작성하십시오. –

'#container {display : none}'? – Pietu1998

@ Pietu1998 오, 방금 그걸 가져 갔어야 했어. 그것은 단지 초기 스타일 일뿐입니다. 나중에 Javascript에서는 블록을 변경합니다. – Denman

링크에 display: block;을 시도해야합니다.

출처

2013-09-07 15:20:37 mdesdev

오 ... 나는 바보 야. 고맙습니다. 그러나 링크가 명시 적으로'display : block; '을 필요로하는 이유는 무엇입니까? – Denman

기본적으로 링크가 차단되지 않습니다.) – mdesdev

어떤 종류의 재설정 또는 boilertemplate CSS를 사용하고 있습니까? –

-1

내가 아는 한 CSS는 클래스와 함께 작동합니다. 그래서,이 코드를 변경 :

<div id="container"> 
<a href="#" id="button" onClick="function();"></a> 
</div>

그것은 완벽하게 작동합니다

<div id="container"> 
<a href="#" class="button" onClick="function();"></a> 
</div>

합니다. 편집 : 디스플레이를 제거하십시오.

출처

2013-09-07 15:22:35

CSS 문은 ID로 잘 작동합니다. 이 대답은 잘못되었습니다. –

CSS는 Id 및 Class와 동일한 방식으로 작동합니다 ... 동일한 이름/클래스를 가진 여러 요소가있는 경우 요소에 클래스를 제공합니다. – mdesdev

div에 링크가 표시되지 않지만 버튼이

답변

관련 문제