Is it possible to give a <td> a title attribut in css?

Is it possible to give the td a title attribut in css?

I want to do the following

<td title="test-ok">ok</td>

<td title="test-failed">failed</td>

in a css, like this

<td class="test-ok">ok</td>

<td class="test-failed">failed</td>

//css file


.test-ok{
//title:"test-ok";
}

.test-failed{
title:"test-failed";
}

Can this be accomplished and how can I do this?

Thanks

Have another quastion, are there a character that takes space but don’t is shown, like space or tab, but actually takes up the space.

for example <td> </td> is not six characters wide. Anyone have a clever idea on how to make space like this?

Thanks

If you want to use more spaces, you must use it’s code: &nbsp. So, if you wana three spaces then you’ll have:    

Regarding your first question i don’t think is posible because a title attribute is not W3C valid.

two things.

One please try not to use the spaces. Use padding and other properties when possible.
Even when using the &nbsp. Not doing so will improve you coding technique.

Regarding your question instead of using a title, change it to id and or class

<td id="test-ok">ok</td>

<td id="test-failed">failed</td>

Then the selectors in the css to:

#test-ok{
//title:"test-ok";
}

#test-failed{
title:"test-failed";
}

or if you use the class=" " then keep it as .test-ok and .test-failed

Regards,
Team 1504

Thanks for the advice regarding padding, will have that in mind, can’t have that now tough, are doing a program that generates html pages. Don’t quite understand your answer team 1504 regarding the quastion with title in css classes/id’s, but i guess that it’s not possible to use the title attribut in css code.

Are there any other sollution to when I hover over a text with a specific class, that a text shows up?

Thanks :slight_smile:

CSS uses Selectors whereas the markup uses Attributes so you could have: td[title=test-ok] { color: green; } within the CSS that would match the title named ‘test-ok’.

Though you cannot alter the colours of the title’s ‘tooltip’ itself as far as I remember, unless of course you use some fancy JavaScript, etc.

<td title=“test-ok”>ok</td>

<td title=“test-failed”>failed</td>

Could you please explain why you need to copy data twice? Why does the td need a title if the text in the td says the same thing?? (that “ok” and “failed” have to do with some “test” should be obvious by using proper table headers or something)

Are you really trying to create a tooltip?

The thing is that i have already generated alot of html pages with this program, and there I have alot of tables with <td> inside with diffrent classes. So when I hover over the following column with class lines_of_code I want it to display

“Total Number of code lines, not counting comments and whitespace.”.

I could just add the title=“Total Number of code lines, not counting comments and whitespace.” to the <td> but I had to ask if there was any way to do this in css so I wouldn’t have to regenerate all those webpages.

So this would be equal to

<tr>
<th>LOC</th>
</tr>
<tr>
<td class="lines_of_code">52</td>
</tr>

this

<tr>
<th>LOC</th>
</tr>
<tr>
<td title="Total Number of code lines, not counting comments and whitespace.">52</td>
</tr>

But thanks anyway :slight_smile:

Wow I don’t even understand post four— which I wrote!

I think what I was trying to.say is that instead of using the title attribute to indentify the table tags you could use the id=" " or class=" " to do so.
Then you could use those identification methods to apply styles to it in CSS.

Hope that makes more sense & best Regards,
Team 1504

but I had to ask if there was any way to do this in css so I wouldn’t have to regenerate all those webpages.

CSS can generate content but cannot, so far as I know, generate attributes (Javascript can). Whatever is creating the HTML pages will have to create the titles, or you’ll have to use Javascript (which may or may not be good enough).

If there was any way I would think it would be on this page:
http://www.w3.org/TR/css3-content/

Lots of ways to use an attribute but I don’t see how to create an attribute.

ok then with you guys, thank you so much for your help, i guess I have to write in the “title” attribut in the erlang program that generates the plain html pages. :slight_smile:

You could do something like this for IE8, Firefox safari etc.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
table{width:500px;}
td{border:1px solid #000;position:relative}

td.lines_of_code:after,
td.test-failed:after{
    content:".....more info";
    position:absolute;
    z-index:99;
}

td.lines_of_code:hover:after,
td.test-failed:hover:after{
    content:"This test failed.";
    position:absolute;
    margin:-.5em 0 0 2em;
    background:#ffc;
    border:1px solid #000;
    padding:3px;
    z-index:99;
    cursor:pointer;
}
td.lines_of_code:hover:after{
    content:"Total Number of code lines, not counting comments and whitespace.";
}


</style>

</head>
<body>
<table>
    <tr>
        <th>LOC</th>
    </tr>
    <tr>
        <td class="lines_of_code">52</td>
    </tr>
    <tr>
    <td class="test-failed">failed</td>
    </tr>
</table>
</body>
</html>


Assuming the generated content isn’t crucial to the page.

As Paul said, if it is crucial to the page then you might want to find a JS solution based (though that would fail with JS off, so it’s a kind of a pain)

IE6/7 don’t support generated content as in Pauls demo, so…yeah. :slight_smile:

i guess I have to write in the “title” attribut in the erlang program that generates the plain html pages.

Wow cool, Erlang?? : )