开发者

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!). 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). 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. 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.

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, on开发者_JS百科ce I figure them out?

  3. Am I overlooking some other solution?

I'm looking to do this strictly with html and css, no other languages. 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).


Same as cellspacing=0 just css:

table {
    border-collapse: collapse
}

And the cellpadding=0 is:

table td, table th {
    padding: 0;
}

Just for you to see the CSS approach too :)


You need to make the html for the table look like this:

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

But you REALLY should do divs. 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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜