Grow your CSS skills. Land your dream job.

Ellipsis bug in webkit?

  • # July 18, 2013 at 2:11 am

    It is annoying that in Safari/Chrome the ellipsis is treated differently from the normal text if I have this CSS:

    .txt {
    text-shadow: 10px 10px 1px #000;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    width: 100px; /* too small for the whole text, so the ellipsis shows */
    color: rgba(255,0,0,0.2);
    }

    You’ll see that the ellipsis in the drop shadow is almost transparent just like the actual (red) text, while the rest of the text in the drop shadow is 100% opaque. Is this a bug? Is there a workaround by styling the ellipsis separately? Is that possible?

    Firefox is doing fine here.

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".