html - 如何摆脱 2 个 html 表之间的额外空间？

标签 html css space

我有 2 个 html 表格，在源 html 文件中，它们之间只有一行，但在浏览器中有很大的空间，我查看了 css，那里没有关于表格的内容，如何摆脱额外的空间？

enter image description here

这是 CSS 文件:

/*
 * GENERICS
 */ 
body {
    background-repeat:repeat-x;
    padding:4px;
    padding-top:0px;
    margin:0px;
}


/*
 *   TOP LEVEL
 */ 
.pageTitle {
    color:#000000;
    font-family:century gothic;
    font-size:22px;
    font-weight:bold;
    line-height:22px;
    vertical-align:bottom;
    border-bottom:solid;
    border-bottom-width:3px;
    border-bottom-color:#0099cc;
}


.topLevelTitleNoLine {
    padding:0px;
    vertical-align:bottom;
    height:35px;
    color:#000000;
    font-family:century gothic;
    font-size:18px;
    font-weight:bold;
}

.topLevelTitle {
    padding:0px;
    vertical-align:bottom;
    height:35px;
    color:#000000;
    font-family:century gothic;
    font-size:18px;
    font-weight:bold;
    border-bottom:solid;
    border-bottom-width:3px;
    border-color:#0099cc;
}


.topLevelSubTitle {
    padding:0px;
    vertical-align:bottom;
    color:#000000;
    font-family:century gothic;
    font-size:16px;
    font-weight:bold;
    border-bottom:solid;
    border-bottom-width:3px;
    border-color:#0099cc;
}

.topLevelSubTitleSmall {
    padding:0px;
    vertical-align:bottom;
    color:#000000;
    font-family:century gothic;
    font-size:11px;
    font-weight:bold;
    border-bottom:solid;
    border-bottom-width:3px;
    border-color:#0099cc;
}

.topHeader {
    background-color:#003366;
    text-align:right;
    vertical-align:bottom;
    color:#ffffff;
}

.topStatus {
        font-family:arial,helvetica,sans-serif;
        font-weight:bold;
        font-size:16px;
        border-bottom: 3px solid #000000;
        color:#00000;
        padding:3px;
        margin:0px;
}


.topnavItem {
        font-family:arial,helvetica,sans-serif;
        font-weight:bold;
        font-size:10px;
        border-bottom: 3px solid #000000;
        color:#ffffff;
        padding:3px;
        text-align: right;
}


.headerCompanyL {
    width:190px;
    text-align:left;
    background-color:#003366;
}


.headerCompanyR {
    width:190px;
    text-align:right;
    background-color:#003366;
}


.headerclient {
    font-family:arial,times,helvetica,sans-serif;
    font-size:15px;
    color:#FFFFFF;
    text-align:left;
    background-color:#003366;
    padding-top:3px;
    padding-bottom:3px;
}


td.footerMsg {
    font-family:arial,helvetica,sans-serif;
    font-size:10px;
    text-align:center;
    line-height:28px;
    color:#999999;
    border-top:solid;
    border-width:1px;
    border-color:#999999;
}


a.footerMsg {
    color:#999999;
    text-decoration:none;
}


a.footerMsg:hover {
    color:#cc0000;
    text-decoration:underline;
}




/*
 *  NAVIGATION
 */ 
a.screensNavItem:link {
    font-size:12px;
    text-decoration:none;
    color:#003366;
}


a.screensNavItem:visited{
    font-size:12px;
    text-decoration:none;
    color:#003366;
}


a.screensNavItem:hover{
    font-size:12px;
    text-decoration:none;
    color:#003366;
}


.screensnavCurrent {
    font-size:12px;
    font-weight:bold;
    text-decoration:none;
    color:#003366;
    background-color:#cccccc;
}




/*
 *   DISPLAY DATA
 */
.displayHeaderCell {
    font-weight:bold;
    font-family:arial,sans-serif;
    font-size:11px;
}

.listTable {
    font-family:arial,sans-serif;
    font-size:11px;
    color:#000000;
    padding:3px;
}

.pageinfotitle {
    font-weight:bold;
    font-size: 11px;
    color:#000000;
    padding:3px;
    background-image:url(background.nav.gif);
    border:solid;
    border-width:1px;
    border-color:#999999;
    border-bottom-color:#000000;
    border-bottom-width:3px;
    vertical-align:bottom;
}
.pageinfotitlered {
    font-weight:bold;
    font-size: 11px;
    color:#FF0000;
    padding:3px;
    background-image:url(background.nav.gif);
    border:solid;
    border-width:1px;
    border-color:#999999;
    border-bottom-color:#000000;
    border-bottom-width:3px;
    vertical-align:bottom;
}

.pageinfotitleClear {
    font-weight:bold;
    font-size: 11px;
    color:#000000;
    padding:0px;
    border:none;
    border-width:0px;
    background: transparent;
    vertical-align:left;
    text-align:right;
}

.pageinfo {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
}

.pageinfolink {
    font-weight:bold;
    font-size: 16px;
    color:#000000;
    padding:3px;
    background-image:url(background.nav.gif);
    border:solid;
    border-width:1px;
    border-color:#999999;
    border-bottom-color:#000000;
    border-bottom-width:3px;
    vertical-align:bottom;
}

.displayCategory {
    font-weight:bold;
    color:#000000;
    font-size:12px;
}

.displayCategorySmall {
    font-weight:bold;
    color:#000000;
    font-size:10px;
}

.displayLargeFont {
    font-weight:normal;
    font-family:arial,sans-serif;
    font-size:14px;
}

.displayRedHint {
        font-family:arial,helvetica,sans-serif;
        font-weight:bold;
        font-size:12px;
        color:#FF0000;
        padding:3px;
        margin:0px;
}

.displayEndDate {
    background-color: transparent;
    border-top: transparent;
    border-right:  transparent;
    border-bottom: transparent;
    border-left: transparent;
    width: 60px;
    height: 20px;
    font-size:11px;
    word-wrap: break-word;
    padding-bottom: 60%;
}

.displayAmount {
    background-color: transparent;
    border-top: transparent;
    border-right:  transparent;
    border-bottom: transparent;
    border-left: transparent;
    width: 60px;
    height: 20px;
    font-size:11px;
    word-wrap: break-word;
    padding-bottom: 60%;
    padding-left: 50%;
}

.processTextDisplayLabel {
    background-color: transparent;
    border-top: transparent;
    border-right:  transparent;
    border-bottom: transparent;
    border-left: transparent;
    font-size:14px;
    word-wrap: break-word;
    padding-bottom: 60%;
}

.formUWButtons {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#ffffff;
    color:#000000;
    width:70px;
}

.formAddButtons {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#cccccc;
    color:#000000;
    width:50px;
}

.processTextDisplayLabel {
    background-color: transparent;
    border-top: transparent;
    border-right:  transparent;
    border-bottom: transparent;
    border-left: transparent;
    font-size:14px;
    word-wrap: break-word;
    padding-bottom: 60%;
}

.processTextSmallLabel {
    background-color: transparent;
    border-top: transparent;
    border-right:  transparent;
    border-bottom: transparent;
    border-left: transparent;
    font-size:11px;
    word-wrap: break-word;
    padding-bottom: 60%;
    width: 190px;
}


/*
 * FORMS
 */
.processTable {
    font-family:arial,sans-serif;
    padding:3px;
    font-size:11px;
    color:#000000;
    border:solid;
    border-width:1px;
    border-color:#000000;
    background-color:#dfdfdf;
}


.processRegular {
    text-decoration:none;
    color:#000000;
    font-size:12px;
}

.processRegularSmall {
    text-decoration:none;
    color:#000000;
    font-size:11px;
}

.processRequire {
    font-weight:bold;
    text-decoration:none;
    color:#000000;
    font-size:12px;
}

.processError {
    font-weight:bold;
    text-decoration:none;
    color:#ff0000;
    font-size:12px;
}

.processTextLabel {
    text-decoration:none;
    color:#000000;
    font-weight:bold;
    font-size:12px;
} 

.processMsgError {
        font-family:arial,helvetica,sans-serif;
        font-weight:bold;
        font-size:14px;
        color:#990033;
        padding:3px;
        margin:5px;
}

.processLargeHeaderText {
    font-weight:bold;
    font-size: 16px;
    color:#000001;
    padding:3px;
    background-image:url(background.nav.gif);
    border:solid;
    border-width:2px;
    border-color:#999999;
    border-bottom-color:#000000;
    border-bottom-width:3px;
    vertical-align:bottom;
} 

.processDisabledText {
    text-decoration:none;
    color:#c0c0c0;
    font-size:12px;
}

.processText {
    font-family:arial,sans-serif;bodyIframe
    font-size:11px;
    color:#000000;
    border:solid;
    border-width:1px;
    border-color:#000000;
    padding-left:5px;
    padding-right:5px;
}

.processTextAlt {
    font-family:arial,sans-serif;
    text-decoration:none;
    color:#000000;
    font-size:11px;
}

.processBaseItem {
    padding:2px;
    padding-top:3px;
    font-size:11px;
}

.processBaseItemSmall {
    padding:2px;
    padding-top:3px;
    font-size:9px;
}


 .processSelect {
    font-family:arial,sans-serif;
    font-size:11px;
    color:#000000;
}
.processSelectClear {
    font-family:arial,sans-serif;
    font-size:11px;
    color:#000000;
    padding:0px;
    border:none;
    border-width:0px;
    background: transparent;
}

 .processSelectFixed {
    font-family:arial,sans-serif;
    font-size:11px;
    color:#000000;
    width:100px;
 }

.processSelectSmall {
    font-family:arial,sans-serif;
    font-size:9px;
    color:#000000;
}

.processBaseButton {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#cccccc;
    color:#000000;
    width:100px;
}

.processBaseFrame {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#cccccc;
    color:#000000;
}

.processSubmit {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#cccccc;
    color:#000000;
    width:90px;
}

.processSubmitRed {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#cccccc;
    color:#FF0000;
    width:90px;
}

.processLabel {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#dfdfdf;
    color:#000000;
    border:none;
    text-align:right;
    width:60px;
}

.processReadOnly {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#cccccc;
    border:none;
    text-align:right;
}


.processMSRCalc {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#cccccc;

    border:solid ;
    border-width: thin;
    text-align:right;
}

.processMSRCalcTotal {
    font-family:arial,sans-serif;
    font-size:11px;
    font-weight:bold;
    background-color:#FFFFFF;
    border:solid ;
    border-width: thin;
    text-align:right;
}

.processBlankRow {
    font-family:arial,sans-serif;
    font-size:6px;
    background-color:#DFDFDF;
    border:none;
    text-align:right;
}


/*
 *  NEWS
 */
.newsBasePageTitle {
    padding:0px;
    vertical-align:bottom;
    height:35px;
    color:#000000;
    font-family:century gothic;
    font-size:18px;
    font-weight:bold;
    border-bottom:solid;
    border-bottom-width:3px;
    border-color:#0099cc;

}

.newsBaseTitle {
    padding:0px;
    vertical-align:bottom;
    color:#000000;
    font-family:century gothic;
    font-size:15px;
    font-weight:bold;
    border-bottom:solid;
    border-bottom-width:1px;
    border-color:#0099cc;
}

.newsBaseText {
    text-decoration:none;
    color:#000000;
    font-size:14px;
}    

.newsBaseTextAlt {
    padding:0px;
    vertical-align:bottom;
    color:#000000;
    font-size:14px;
    border-bottom:solid;
    border-bottom-width:1px;
    border-color:#0099cc;
}



/*
 * STATUS
 */
.statusStyleSearchResult {
        padding: 3px;
        line-height: 18px;
}

.statusStyleSearchResult TD {
        padding: 3px;
        color: black;
        font: 11px Arial, Helvetica, Sans-Serif;
        border-bottom: 1px solid black;
}

.statusStyleNew {
        background-color: #8AC5ff;
}

.statusStyleFrozen {
        background-color: #E70000;
}

.statusStyleFuture {
        background-color: #FFAAFF;
}

.statusStyleExpired {
        background-color: #EB66D3;
}

.statusStylePending {
        background-color: #FFE4B0;
}

.statusStyleApproved {
        background-color: #99ffcc;
}

.statusStyleMoreInfo {
        background-color: #ffff99;
}

.statusStyleEdit {
        background-color: #8AC5ff;
}

.statusStyleExclusive {
        background-color: #8AC5ff;
}

.statusStyleDeclined {
        background-color: #ffcccc;
}

.statusStylePresented {
        background-color: #00ffff;
}

.statusStyleBound {
        background-color: #00ff99;
}

.statusStyleBoundOther {
        background-color: white;
}

.statusStyleClosed {
        background-color: #E0E0E0;
}

.statusStylePreScreened {
        background-color: #FF6600;
}

.statusStyleCancelled {
        background-color: #ff9999;
}

.statusStypePendingEndorsement {
        background-color: #CC99FF;
}

.statusStyleSuspend {
        background-color: #FFE4B0;        
}

.statusStylePendingRenewal {
        background-color: #99FF33;        
}

.newType {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
        background-color:#8AC5ff;
}

.pendingType {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
        background-color:#FFE4B0;
}

.more-informationType {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
        background-color:#ffff99;
}

.approvedType {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
        background-color:#99ffcc;
}

.declinedType {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
        background-color:#ffcccc
}

.pending-endorsementType {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
        background-color:#cc99ff
}

.boundType {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
        background-color:#00ff99
}

.presentedType {
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
        line-height:18px;
        color:#000000;
        border-bottom: 1px solid #000000;
        padding:3px;
        background-color:#00ffff
}




/*
 * ERRORS
 */ 
.errorLogon {
    text-decoration:none;
    color:#ff0000;
    font-size:12px;
}

.exceptionType {
    font: 10px lucida console;
    color: black;
    border: 1px solid black;
    padding:3px;
}

.exceptionType TH {
    background: silver;
}

.exceptionType TD {
    background: white;
}




/*
 * GENERAL
 */

.spacer {
    padding:0px;
    font-size:1px;
}

.centerBlock {
    vertical-align:middle;
}

.fieldBase {   
    font-size: 11px;
    color:#000000;
    padding:0px;
    background-color:#dfdfdf;
    border:solid;
    border-width:1px;
    border-color:#dfdfdf;
    border-bottom-width:3px;
    vertical-align:bottom;
}    

.fieldBaseR {
    font-family:arial,sans-serif;
    font-size:11px;
    color:#000000;
    border:solid;
    border-width:1px;
    border-color:#000000;
    padding-left:0px;
    padding-right:1px;
    text-align:right;
}    

.fieldBaseL {
    font-family:arial,sans-serif;
    font-size:11px;
    color:#000000;
    border:solid;
    border-width:1px;
    border-color:#000000;
    padding-left:0px;
    padding-right:1px;
    text-align:left;
}

.emailLabel {
    text-decoration:none;
    color:#000000;
    font-weight:bold;
    font-size:12px;
    width:230px;
}

td.copyright {
    font-family:arial,helvetica,sans-serif;
    font-size:10px;
    text-align:center;
    line-height:28px;
    color:#999999;
    border-width:1px;
    border-color:#999999;
}

最佳答案

您可以从 CSS 重置中受益。添加到您的 css 文件的顶部(在 body {} 声明之前):

* {margin: 0; padding: 0;}

请注意 CSS 重置将删除所有默认边距/填充。您需要在合适的时候手动添加它们。对于不太通用的重置，请尝试:

table {margin: 0; padding: 0;}

关于html - 如何摆脱 2 个 html 表之间的额外空间？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25628626/

上一篇：jquery - 动态加载内容时传单弹出窗口未对齐

下一篇：html - 使具有两层的导航栏和下拉菜单在第二层水平移动

相关文章：

javascript - 单击 jQuery 不工作时删除 div 元素

javascript - 从函数内的数组中选择所有复选框

css - 悬停在父元素上的 Cufon

php - php中的下拉框从mysqli数据库获取部分值

javascript - Bootstrap 自动折叠

jquery - 创建侧边菜单以在悬停时打开菜单(一次只能打开一个菜单)？

css - 如何使用 2 列上的像素指标使 3 列布局填充 100% 宽度？

css - 在 Dynamic Web Project 中访问 c​​ss、js 文件的问题

css - 在另一个 div 上放置和对齐一个 div

python - 输出间距错误

©2024 IT工具网  联系我们