CODEWITHSUNDEEP
css
Leggy
Leggy

Reputation: 682

Replacing Content in DIV - CSS Only

I have a table where i want to REPLACE the text in the TD but it currently just adds the text to it. Is there any way to replace the text with CSS ONLY? The example below would show "Some new stuffText here" in the TD but I want it to show "Some new stuff" only.

<table>
<tr>
    <td data-text="Some new stuff">Text here</td>
</tr>
</table>

CSS:

table td:before { 
    content: attr(data-text); 
}

JSFiddle

Upvotes: 0

Views: 46

Answers (1)

Bhojendra Rauniyar
Bhojendra Rauniyar

Reputation: 85545

Use like this:

td[data-text]{
    font-size: 0;/*hide the text inside td*/
}
table td:before { 
    content: attr(data-text); 
    font-size: 16px;/*show the text of content*/
}

demo

Upvotes: 1

Related Questions