CODEWITHSUNDEEP
javascriptjqueryhtmlcssjquery-mobile
gabaum10
gabaum10

Reputation: 3827

jquery mobile dynamic listview cell height

Good morning SO,

So I have a simple question I can't seem to find anywhere. Does anyone know how to dynamically adjust the height of a listview cell depending on the height of the content? I am creating the cells like this:

$threadTable.append(
                $('<li>').append(
                    $('<img>').attr('src',"photo/url").attr('onerror','imageError(this);'),
                    $('<h3>').text(message.username),
                    $('<p>').html(message.body ? message.body : "There is no message text for this message")                
                ));

I was hoping adding a CSS word wrap attribute to the <p> would do the trick, but alas, the content is still overflowing outside the cell. Does anyone know what would solve this to grow the height of the cell? Thanks!

Just tried to do this: $('<p>').html(message.body ? message.body : "There is no message text for this message").css({"overflow":"visible"})

No dice...

Upvotes: 1

Views: 2093

Answers (1)

gabaum10
gabaum10

Reputation: 3827

So I found a CSS solution that works:

.ui-li-desc { 
        overflow: visible !important; 
        white-space: normal !important;  
    }

basically you just have to override the default JQM overflow options. That did the trick. Hope that helps someone else with this problem... :)

Upvotes: 2

Related Questions