HTML Attribute Length Limit

Hi guys! I’m trying to implement a tooltip on a link within a paragraph. See example here (mission section) - http://brawl-for-a-cause.webflow.com/about

My css is getting the tooltip content from a custom HTML attribute, however in Webflow it appears custom attributes have a length limit (100 characters). How can I get around this or find an alternate solution?

Here’s my CSS for that specific tooltip element:

.tooltip:hover:after{
    background: #333;
    background: rgba(0,0,0,.8);
    border-radius: 5px;
    bottom: 26px;
    color: #fff;
    content: attr(data);
    left: 20%;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 220px;
}

Hey @matthew1818, do you have an approximate higher limit that you’d like custom attributes to be limited to? We want to keep it reasonable (to prevent crazy scripts in there), but also want to keep things flexible.

Hi, I thought I would put in my experience, I have had this issue with the data attribute limit only once and I think my length was something about 120 chars… if possible to update to 150 would be good :smile:

I guess it depends on the scripts being used… the script I was using was a parallax slider. My workaround was to just use an html embed and create the divs with attributes separately in html and paste that in to the embed widget.

Cheers

I don’t need any crazy high limit - 250 characters would be sufficient. If there’s a workaround you know of then I’m happy to try that. Thanks @callmevlad!

Hi @matthew1818!

How did you make the tooptip appear in the first place?

I’m trying to do that but I don’t know how :smile:

Thanks a lot,

Cesc

Hey @matthew1818 - later today, we’re pushing a change to increase the limit to 512 characters :smiley:

1 Like

Awesome! Appreciate that!