Mivela
Mivela

Reputation: 25

Long post title

I work on this project http://www.paulund.co.uk/create-polaroid-image-with-css Everything's work fine except long post title ( wordpress ). Original code:

.polaroid-images a:after {
    color: #333;
    font-size: 20px;
    content: attr(title);
    position: relative;
    top:15px;
}

and I added this:

white-space: nowrap;
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;

but text-overflow: ellipsis; not work... Is it possible to do this? Any help is welcome.

Upvotes: 2

Views: 59

Answers (1)

Jared
Jared

Reputation: 12524

Adding display: block should remedy this.

.polaroid-images a:after {
    color: #333;
    content: attr(title);
    display: block;
    font-size: 20px;
    max-width: 200px;
    overflow: hidden;
    position: relative;
        top: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

Fiddle

Upvotes: 2

Related Questions