Databases
StackOverflow2013
Postsdbo
POAdding '...' at the end of each second cell in my table
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAdding '...' at the end of each second cell in my table
    text
    copied!<p>I would like to add 3 dots ("...") at the end of each second cell in my table because this is a column which expand with the window size (see screenshots below).</p> <p><img src="https://i.stack.imgur.com/voNik.png" alt="enter image description here"></p> <p><img src="https://i.stack.imgur.com/epdt5.png" alt="enter image description here"></p> <p>Here is my css:</p> <pre><code>table.list { table-layout:fixed; width: 100%; white-space: nowrap; } table.list td { border-bottom: 1px dotted #d9d9d9; height: 25px; padding-bottom: 2px; } table.list th { text-align:left; } table.list td:nth-child(1), table.list th:nth-child(1) { width: 160px; } table.list td:nth-child(2), table.list th:nth-child(2) { width: auto ; overflow:hidden; } table.list td:nth-child(3), table.list th:nth-child(3) { width: 110px; padding-left: 20px; } table.list td:nth-child(4), table.list th:nth-child(4) { width: 50px; padding-left: 20px; } </code></pre> <p>As you can see, the second cell is auto adjusting (hiding/showing text varying, depending on the window width).</p> <p>I already try this one:</p> <pre><code>table.list td:nth-child(2):after { content: "..."; } </code></pre> <p>It doesn't work.</p> <p>Any suggestions? Thanks.</p> <p><strong>EDIT</strong></p> <p>I update my question because I'm a step further with the help of Ofir Farchy See my demo here <a href="http://jsbin.com/ulofoq/23/edit#preview" rel="nofollow noreferrer">http://jsbin.com/ulofoq/23/edit#preview</a> with Internet Explorer.</p> <p>No problem with Chrome, only with Internet Explorer.</p> <p>Let's try to resize the window and you'll see that I get '...' in front of the text in the first line of the table. That's ok. But for the second line these '...' are not showed !!??</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload