Formatting an HTML table with CSS

Hello, I'm working on a CSS script to format a table. My challenge here is that the table in question is generated with a rule engine product, and the fastest way for me to place some formatting in the table is thru CSS. So far, I have only added a border to the table and added collapsible borders to the rows and columns. What I would like to do, is have the column's width adjust according to the content. Can this be done?

Thanks...
horaliaAsked:
Who is Participating?
 
MikeyLLBCommented:
#ReviewTable{
	border: 1px solid #C6C6C6;
	margin: 2px 70px;
	border-collapse: collapse;
	column-width: auto
}

#ReviewTable td {
	font-size: 1em;
	border: 1px solid;
	border-collapse: collapse;
	padding: 3x 7px 2px 7px;
	column-width: auto;
	white-space: nowrap;
}

Open in new window


This seems to work for me.

http://mjco.me.uk/test/
0
 
MikeyLLBCommented:
In the CSS try setting "column-width: auto;"
0
 
horaliaAuthor Commented:
Didn't work... This is the CSS code I have so far:

      #ReviewTable{
            border:1px solid #C6C6C6;
            margin:2px 70px;
            border-collapse: collapse;
            column-width:auto
      }
      #ReviewTable td {
            font-size:1em;
            border:1px solid
            border-collapse:collapse;
            padding:3x 7px 2px 7px;
            column-width:auto
      }
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
MikeyLLBCommented:
Try using just "width:auto;" and also set "white-space: nowrap;"
0
 
MikeyLLBCommented:
Also, you are missing a ";" after your border property in the TD style group.
0
 
MikeyLLBCommented:
Also, you may want to specify the border colour in the TD group rather than the Table group.
0
 
horaliaAuthor Commented:
Not working yet... And I also just realized I have another issue as I was applying these changes to the other tables.... In the table, I have set some javascript to hide the contents of the row if the row doesn't have an answer... Well, the row is hidden, but not the borders. So, when a few rows are hidden, a thicker gray line appears in its place. Would you have any idea how to fix this?
0
 
MikeyLLBCommented:
can you post an archive of the complete code. Looking at partial html/css makes it difficult to find the issue.
0
 
horaliaAuthor Commented:
I decided to use a different route to create the table, unfortunately, this being an HTML driven code, there's not a lot I can do with just CSS. I appreciate your time and award you the points. Thank you.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.