Wednesday, December 4, 2013

Changing appearance of Bootstrap ToolTip

Today I worked on Bootstrap tooltips. I needed to set up several different tooltips on one page. The problem was with width of the Tooltips. I can not have the same width for all of them and had to set up different width for different tooltips. Thanks article, I found the way to set up the different width.

Each division has an unique class name (business_name and business_description) and I changed tooltip set up only this class (css)

/*specially for this template I changed Bootstrap tooltip width to handle a Product name*/
.business_name + .tooltip > .tooltip-inner {
    width: 350px;
}
/*specially for this template I changed Bootstrap tooltip width to handle a Product description*/
.business_description + .tooltip > .tooltip-inner {
    width: 350px;
}

These definitions overwrite Bootstrap tooltip and create a new setup.

No comments:

Post a Comment