css overflow in a: hover tag

Question

У меня есть изображение (карта) с некоторыми интересными точками, использующими положение: абсолютное и координаты каждой пои. Я хочу, чтобы расширить информацию о каждой POI при наведении курсора мыши с помощью:

.poi a { 
    width: 32px; 
    height: 32px; 
    overflow: hidden 
} 

.poi a:hover { 
    width: 128px; 
    height: 192px; 
    overflow: auto 
} 

Это отлично работает в IE, но он не работает в Firefox или хром. Он не обрезает переполнение, он просто показывает всю информацию сразу.

Answer 1

Сделайте их блочными или встроенными блоками, потому что (из фрагмента выше) ссылки являются встроенными, которые не имеют переполнения.

.poi a { 
    width: 32px; 
    height: 32px; 
    overflow: hidden; 
    display: block; 
}