2015-01-15 2 views
1

동일한 문제가 있습니다. 내가 회사 등록이 상단에 정렬 할표 셀 div에서 위쪽 패딩 제거

enter image description here

:

.mainDiv { 
    border-spacing: 15px; 
} 

.formDiv { 
    width: 300px; 
    background-color: #F5F6CE; 
    padding: 10px; 
    margin-left: 20px; 
    display: table-cell; 
    vertical-align: top; 
} 

.resultDiv { 

    background-color: #F5F6CE; 
    padding: 20px; 
    box-shadow: 5px 5px 5px #888888; 
    margin-left: 20px; 
    display: table-cell; 
    width: 100%; 
} 

는 지금, 나는 결과 formDiv<h1>을 추가 할 수 있습니다.

나는 많은 스레드주고 답을 찾을 :

vertical-align: top;

을하지만 나를 위해 작동하지 않습니다. 도와주세요.

HTML은 다음과 같습니다

<div class="mainDiv"> 
     <div class="formDiv" align="center"> 

      <h1 align="center">Company Registration</h1> 

      <form id="compReg" onsubmit="SaveData();return false;"> 
       <Table align="center" cellspacing="5px"> 
        <tr> 
         <td> 
         <Input id="txtEmail" type="email" class="text" placeholder="Contact Email" /> 
         </td> 
        </tr> 
        <!-- other input types --> 

        <tr> 
         <td> 
         <Input type="submit" value="Submit" /> 
         &nbsp; &nbsp; &nbsp; 
         <Input type="reset"/> 
         </td> 
        </tr> 

       </table> 

      </form> 
     </div> 

     <div class="resultDiv" id="result"> 
      <div align="right"> 
       <input type="button" onclick="clearData()" value="Clear" /> 
       <br> 
       <br> 
      </div> 
      <table class="dataTable" width="300"> 
       <thead> 
        <th width="20px">Id</th> 
        <th width="250px">Email</th> 

        <!-- other headers --> 

        <th width="50px">Color</th> 

       </thead> 

       <tbody id="tbody"> 

       </tbody> 
      </table> 
     </div> 

    </div> 

체크 JSFiddle 내가 "문제"H1은 왼쪽 사업부의 상단에 정렬하고 싶습니다.

+0

무슨 문제가 있습니까? 바이올린을 추가 할 수 없습니까? – Chris

+0

최소한의 예를 게시하십시오. (즉, 마크 업) – jbutler483

+0

HTML을 게시 할 수 있습니까? – clami219

답변

1

H1 태그는 기본 마진을 가지고있다. 0px로 설정하십시오.

h1{ 
    margin:0px; 

} 
0

는 기본 테이블 패딩과 마진 값이

#yourtable { 
    margin: 0; 
    padding: 0; 
} 
0

당신이 의미 재설정 해보십시오? 다음 번에 HTML 마크 업을 게시하십시오! 당신의 바이올린에서

h1 { margin:0; background: blue; } 
 
.formDiv { 
 
    width: 300px; 
 
    background-color: #F5F6CE; 
 
    margin-left: 20px; 
 
    padding: 0 10px 10px 10px; 
 
    display: table-cell; 
 
}
<div class="wrapper"> 
 
    <div class="formDiv"> 
 
    <h1>Lorem</h1> 
 
    <p>ipsum dolor</p> 
 
    <input name="test" type="text"> 
 
    </div> 
 
</div>

봐 : http://jsfiddle.net/xsmzLb3g/2/

당신은 H1과 DIV의 여백/패딩을 변경해야합니다.

0

내 이해 에서처럼 테이블을 사용하고 있고 테이블 셀 간격 문제를 해결하려고하는 경우. 제로 셀 간격과 셀 패딩을 시도하십시오. H1 간격에

<table cellpadding="0" cellspacing="0"> 

CSS는

table h1{ margin:0; padding:0; } 

JSFIDDLE DEMO

+0

테이블을 사용하고 있지 않습니다. 디스플레이가있는 div가 2 개 있습니다. table-cell – SurajS

+0

문제의 바이올린을 확인하십시오. – SurajS

관련 문제