How to fit that extra bit of text

di-logo

More text can definitely convey more information to the user, but sometimes this text has to fit in a small area and sometimes there is just too much text!

In this challenge, I have several square boxes of the same size. Each box has a small amount of text on top with an image below. All but the last box – which needs to include even more text in their disclaimer. Unfortunately, I can’t fit all this text in the box!

Because this extra text is only a disclaimer, I figure it doesn’t need to be visible all the time. So, I made it popup on hover and this won’t affect the size of the square box.

(Here are the before and after screenshots of the hover effect on the bottom right box)

Tools: HTML5, CSS3.

CochranEV.com

Author: admin