2016-09-10 3 views
-1

오른쪽 남자들이 내 첫 웹 사이트를 코딩하고 길을 따라 약간의 충돌을 쳤습니다. 어떤 도움이라도 대단히 감사합니다. 좋아, 그래서 5 초가 동일한 너비가되도록 내 테이블 (탐색 바 역할)의 스타일을 지정하려고했습니다. 나는 테이블 너비를 100 %로, 5 개의 tds를 20 %로 설정했습니다. 그러나 width 속성은 적용되지 않습니다. 그래서 다른 폭으로 시도했지만 아무도 적용되지 않습니다. HTML테이블 데이터 너비가 적용되지 않습니다

<!DOCTYPE html> 
<html> 
    <head> 
    <link rel="stylesheet" type="text/css" href="css.css"/> 
<title>First Website</title> 

    </head> 

    <body> 

     <section class="header"> 

     <header> 
<a href=""><img src="Cantpostimagehere"/></a> 
</header> 

     </section> 

     <section class="navbar"> 

     <nav> 

      <table> 

       <tr> 

        <td><a href="">About Me</a></td> 

        <td><a href="">Funny stuff</a></td> 

        <td><a href="">Home</a></td> 

        <td><a href="">Cool Pictures</a></td> 

        <td><a href="">Contact me</a></td> 

       </tr> 

      </table> 

     </nav> 

     </section> 

     <section class="main"> 

      <img src="Cantpostimagehere"/> 

     </section> 

    </body> 

</html> 

당신은 display:block이 공간을 채우기 위해 TD 위해서는, 테이블에 적용한

.header img{ 

    display:block; 
    margin:0 auto; 

    width:50%; 

    padding:0 0 5px 0; 

} 
.navbar td{ 
text-align:center; 
    width:20%; 

} 

.navbar a:link{ 

    color:gray; 

    text-decoration:none; 

} 

.navbar a:visited{ 

    color:gray; 

    text-decoration:none; 

} 

.navbar a:hover{ 

    color:purple; 

    font-weight:bolder; 


} 

.navbar table{ 

    position:fixed; 
    width:100%; 

    display:block; 

    margin:0 auto; 

    background-color:#cccccc; 

    padding:10px; 

    border:2px solid #999999; 

} 

.main img{ 
    width:90%; 

    display:block; 

    margin:10px auto; 

    padding:2px; 

    border:4px solid #999999; 

} 

답변

2

CSS가 제대로 부모의 (테이블) 요구 사항 : 여기 내 코드입니다 display:table

편집 됨으로 설정됩니다. 감사합니다 @Oriol

+1

''는 이미 테이블 셀로 작동합니다. 그러나 '

'만큼 넓지는 않은 익명 테이블의 테이블 셀은, – Oriol

관련 문제