Как я могу использовать эллипсы в таблице ширины жидкости, не делая каждый столбец одинакового размера?

Позволять'скажем, мои столбцы в таблице,idnamedescription, а такжеphone,description столбец состоит из 1-255 символов, но идентификатор не более 3 символов.

Мне бы хотелось, чтобы столбцы имели соответствующий размер, а не каждый столбец одинакового размера. И я'мне нравитсяdescription столбец для переполнения многоточием, когда окно слишком мало, чтобы вместить содержимое целиком.

table-layout:fixed; это стандартный способ сделатьtext-overflow: ellipsis; работать, но он изменяет размер всех столбцов до одинакового размера. Я'предпочитаю сохранить ширинуauto а не исправлено.

Вы можете помочь?

Вот'мойjsFiddle:http://jsfiddle.net/RQhkk/1/

Вот'скриншот того, что яЯ имею дело с:

Обратите внимание, какTable 1 делает все столбцы одинакового размера? Тот'это ужасно

Обратите внимание, какTable 2 размеры столбцов в зависимости от содержимого? Тот'хорошо. За исключением случаев, когда контент слишком длинный:Table 3, Тогда это нене подходит В этом случае яМне бы хотелось, чтобы оно переполнилось многоточием.

И здесь's моя таблица html и код css:



    
        
            id
            name
            description
            phone
        
    
    
        
            1
            alpha
            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
            555-555-5555
        
        
            2
            beta
            Sed et nulla neque.
            555-555-5555
        
        
            3
            gamma
            Morbi imperdiet neque ut lorem rhoncus fermentum.
            555-555-5555
        
    




#t1 table {
    table-layout:fixed;
    width:100%;
}
#t1 td {
    white-space: nowrap;
}
#t1 td.ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-break: break-all;
    word-wrap: break-word;
}

Если я удалюtable-layout: fixed; ширина столбца - это то, что выбуду ожидать - по размеру контента. К сожалению, я просто могуМноготочие работает без фиксированной разметки. Куда я иду не так?

Ответы на вопрос(3)

Ваш ответ на вопрос