2016-07-02 4 views
0

버튼이 있습니다. 그러나 그들은 페이지에 보여주고 싶지 않습니다. 버튼의 가시성과 충돌하는 CSS가 없습니다. 죄송합니다. 이것이 바보 같은 질문이라면 제 CSS에 녹슨 것 같습니다.버튼이 페이지에 표시되지 않습니다. HTML5

HTML: 

<!doctype html> 
<html> 
    <head> 
     <title>Hello, World!</title> 
     <!--references--> 
     <link rel="stylesheet" type="text/css" href="styles/index.css" /> 
     <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script> 
    </head> 
     <body> 
      <div id="wrapper"> 
       <div id = "box"> 
        <h1 id="head">hello, world!</h1> 
        <div id = "btn-panel"> 
         <button class="btn" id="btn1">panel1</button> 
         <button class="btn" id="btn2">panel2</button> 
         <button class="btn" id="btn3">panel3</button> 
         <button class="btn" id="btn4">panel4</button> 
        </div><!--button-panel--> 
       </div> <!--Box--> 
      </div> <!--wrapper--> 
     </body> 
    <script src="js/Index.js" type="text/javaScript"></script> 
</html> 

CSS는 :

body { 
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
    font-weight: 300; 
} 

#wrapper { 
    width: 100%; 
    height: 100%; 
} 

#box { 
    background-color: #EEE; 
    Width: 100%; 
    Height: 250px; 
    margin-left: auto; 
    margin-right: auto; 
    Text-align: center; 
} 

#head { 
    padding-top: 25px; 
    font-size: 20pt; 
} 
#btn-panel { 
    width: 1000%; 
    height: 100px; 
    margin-top: 50px; 
} 

.btn { 
    width: 100px; 
    height: 25px; 
    border-radius: 5px; 
} 

어떤 도움을 크게 감상 할 수있다. 감사.

답변

0
#btn-panel { 
width:100%; /*or pixels, whichever one you chose*/ 
height:100px; 
margin-top:50px; 
} 

문제입니다.

1

다음은 100 %를 작성하지 않은

#btn-panel { 
    width: 1000%; /* <- Should be 100, not 1000 */ 
    height: 100px; 
    margin-top: 50px; 
} 
관련 문제