CSS - Cellspacing In Css - Solved!

I am constructing a table (needs to be table) where the first 2 columns of data need to have no spacing in between them. However I want the rest of the columns to have spacing of say 4px. Is this possible?

I cant create a table within a table to solve the problem either because all of the cells in the table are related. I tried setting the table to have no spacing and then applying margins to the cells i want to have margins, but no margins were applied. Any ideas?

Is there a way to override CSS padding to use cellpadding instead or can inheritance be prevented? I have a CMS and I want editors to still be able to use the cellpadding attribute rather than make a class for each desired padding.

I am not able to set a defining ID or class on the table as it's generated with our CMS. The relevant tables are contained in a defined parent class.


Code:

TD{ padding: 0px; }
.custom TD{ /*padding: ignore;*/ }

Code:

<span class="custom">
    <table cellpadding="5">
         ...
    </table>
<span>

Hi

I'm sure this is an easy one, but I can't figure out how to create a table style sheet that does exactly what the following html does

Code:

<table width="100" border="0" cellspacing="0" cellpadding="0" bgcolor="blue">
	<tr>
		<td bgcolor="yellow"></td>
	</tr>
</table>

I tried many different variations using the table-specific keys documented here but am unable to achieve the above effect.

What's happening is that the yellow background of the "td.outlineCollapsed" style (below) has a 1 pixel inset on all sides from the edges of the "table.outlineBase" style box. With the html, by contrast, the yellow background of the <td> exactly overlaps the blue background of the containing table. The exact overlap is what I'm trying to acheive.

Could someone take a look and tell me what I'm doing wrong?

Thanks

Ken

Here's the css:
Code:

table.outlineBase {
	background-color: #888888;
	width: 100%;
	height: 20px;
	/* 
	tried all of the following in many 
	different combinations. Nothing worked. 
	
	border-style: hidden;
	border-collapse: collapse;
	border-spacing: 0px;
	border: outset 0px;
	border-spacing: 0px;
	border: inset 0px;
	*/
	}

table.outlineBase:hover {
	cursor: pointer;
	}

td.outlineCollapsed {
	background-color: yellow;
	width: 25px;
	height: 20px;
	}

I'm using a word wrap function in CSS that looks like this.

.wordwrap {
word-wrap:break-word;
}

It's very effective in preventing any tables on the entire site from stretching (comment boxes, news feeds, etc).

However, it is SO effective that it will cut a word in half if it hits the edge of the table for example, a sentence like:

L1 "The cow and dog jumped over the "
L2 "moon and fell off."

Might come out as:

L1 "The cow and dog jumped over the mo"
L2 "on and fell off."

Any ideas on how I can use this function without cutting words in half? It does such a great job at preventing tables from stretching.

Hello all, first time poster here...

I was working on a new site for an RP environment I gm using a table based layout. I ran into some problems and got fed up with it, So now for all the great reasons out there I decided to better learn CSS overnight and make the layout based on div tags and all that good stuff instead.

After piling all my information into the page I've been having some funky stuff happen to the layout; the right most column moves down below the other two if the window takes up less than the 1000px width I've allotted. Does anyone know why and a way to fix this? Please feel free to rip on my usage of png-s or anything else you'd like to also

Here's a temp link to the page on my site: louisjustmanDOTcom/prinz/newMOTD.html

...and a direct to my css file too: louisjustmanDOTcom/prinz/css/master.css

Thanks a lot in advance!

EDIT: Wow; all that time and it was a stupid mistake... extra closing div tag where i didn't need one.

hi, i'm designing my page and i would like my tables to look similarily as Dev Shed Forums table in the "main menu" (the starting page).

i cannot find out how this is done: the first table row uses cellspacing, the second row doesn't use it and the third row uses it again.
(where 1st row is where "Forum,Last Post,Threads,Posts" is written, 2nd with "Programming Languages" and 3rd with "PHP Development")

well, maybe it's not done this way at all (i tried to decode the HTML code but it was too complicated for me), but i would like to ask if it can be done somehow this way (eg: to define a table with cellspacing and then override this setting in one specific row with some CSS rule) or i have to use more tables to achieve this effect?

it came in to my mind when i saw something similar in the Dev Shed Forum's HTML code:
Code:

<td style="padding: 0px;">

is there something similar which influences cellspacing?
thank you

what is the equivilant to <table border="1" cellpadding="2" cellspacing="0"> in css?

i've tried
PHP Code:
 table
{
    border-spacing: 0px;
    padding: 0px;
    border-colapse: colapse;
    border-style: solid;
    border-width: 1px;
}
td
{
    border-style: solid;
    border-width: 1px;
    padding: 2px;
} 





That makes the width 2px wide though. I want it to only be one. And the padding seems to be messed up as well.