2016-11-26 1 views
0

내 버튼 중 하나가 CSS의 여백이나 여백에 반응하는 데 문제가 있습니다. 버튼은 div의 맨 아래에 머물러 있으며 div에 할당 된 클래스 내의 여백이나 여백에 반응하지 않습니다.버튼이 CSS의 여백이나 여백에 반응하지 않습니다.

HTML

<div class="topBorder"> 
    <h1>Matt</h1> 
    <a href="#" class="aboutButton">ABOUT</a> 
</div> 

CSS

.aboutButton { 
     color: white; 
     padding: 800px; 
     font-size: 20px; 
     font-family: 'Ubuntu'; 
} 

Current Look

+0

'display : inline-block'을 사용해 보셨습니까? –

+0

일반적으로 스크린 샷보다는 최소한의 라이브 코드 세트로 문제를 표시하는 것이 훨씬 더 유용합니다. – jcuenod

답변

0

에 한번 당신의 CSS 버튼 display:inline-block를 추가. 이렇게하면 필요에 따라 조정할 수 있습니다. div는 기본적으로 블록 레벨 요소이며 사용 가능한 전체 너비를 차지합니다. 인라인 요소는 필요한만큼만 공간을 차지합니다. 인라인 블록을 사용하면 요소의 폭과 높이를 지정할 수 있습니다.

http://www.w3schools.com/css/css_display_visibility.asp

+1

''inline-block'을 의미합니까? – jcuenod

+0

@jcuenod 아마도 HTML 전문가가 아닙니다. 나는 그것이 인라인 블록 일 수 있다고 생각했다. –

+0

@jcuenod 맙소사 그게 무슨 뜻인지. 방금 확인 했어. 내 잘못이야! 감사. –

관련 문제