简体   繁体   English

消除元素之间的水平空白

[英]Eliminate horizontal white space between elements

I'm new to the html/css world and learning as I go, designing a simple web site for my business (no Flash, no e-commerce, just information -- SIMPLE!). 我是html / css领域的新手,并且边走边学,为我的企业设计了一个简单的网站(没有Flash,没有电子商务,只是信息-简单!)。 This may be a pretty basic question -- I rather hope it is -- but I can't find it addressed in any number of forums. 这可能是一个非常基本的问题-我希望是这样-但我找不到在任何数量的论坛中都能解决的问题。 In fact, most people who are asking are trying to do the opposite. 实际上,大多数提出要求的人都在尝试相反的做法。

I'm specifying XHTML for the page, and using an HTML table (I know, I know, but I'm still trying to get my hands around CSS divs, and I expect the problem might not go away, anyway). 我正在为页面指定XHTML,并使用HTML表(我知道,我知道,但我仍在尝试绕过CSS div,并且我希望问题无论如何都不会消失)。 I have one row with a light gray background. 我有一排浅灰色的背景。 In the second row, the 1st cell has an orange background. 在第二行中,第一个单元格具有橙色背景。 Between the two are two pixels of white, so the colors don't touch. 在两个像素之间是两个白色像素,因此颜色不会接触。 I have margins, borders, and padding all set to 0, and nothing I do gets rid of these white rows. 我的页边距,边框和填充都设置为0,而我所做的任何事情都不能摆脱这些白色行。 Aside from the settings mentioned, I've also tried setting a solid border, which had no effect. 除了提到的设置,我还尝试设置一个实线边框,这没有效果。 This is happening in both Firefox 3.6 and IE 8. Firefox 3.6和IE 8中都在发生这种情况。

To sum up the question: 总结一下问题:

  1. Is this a function of using tables? 这是使用表格的功能吗?

  2. If so (or even if not), will using DIVs resolve the issue, once I figure them out? 如果是这样(或什至不是),一旦我弄清楚了,使用DIV是否可以解决问题?

  3. Am I overlooking some other solution? 我是否在忽略其他解决方案?

I'm looking to do this strictly with html and css, no other languages. 我希望使用html和CSS严格执行此操作,没有其他语言。 I've been working with computers for over 30 years, but the last programming I did in earnest was in FORTRAN 77 and I haven't worked much with 3GL or 4GL languages (a tiny bit of PERL, some scripting languages in test tools, I'm quite knowledgeable in UNIX scripts, and I can read but not write VB and the C family). 我使用计算机已有30多年的历史了,但是我认真进行的最后一次编程是在FORTRAN 77中进行的,并且我对3GL或4GL语言的使用不多(很少的PERL,测试工具中的某些脚本语言,我对UNIX脚本非常了解,并且可以阅读但不能编写VB和C系列。

Same as cellspacing=0 just css: cellspacing=0相同,只是css:

table {
    border-collapse: collapse
}

And the cellpadding=0 is: 并且cellpadding=0为:

table td, table th {
    padding: 0;
}

Just for you to see the CSS approach too :) 也是为了让您看到CSS方法:)

You need to make the html for the table look like this: 您需要使表的html如下所示:

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

But you REALLY should do divs. 但您确实应该做div。 They are far superior AND they will solve your problem. 他们优越得多,他们将解决您的问题。

Sounds like it might be a cell padding or cell spacing issue. 听起来可能是单元格填充或单元格间距问题。 Try this documentation. 试试这个文档。 It also provides a quick method for checking html. 它还提供了一种检查html的快速方法。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM