HTML+CSS+JavaScript

добрый день, интересует вопрос, кроссбраузерна ли данная конструкция, и стоит ли ее использовать?

К примеру хотим чтобы при наведении на ссылку блок внутри ссылки менял свой внешний вид:

<style> .block { width:100px; height:100px; } .main a:hover .block { width:150px; height:150px; border:2px #000 solid; } </style> <div class="main"> <a href="#">Текст <div class="block"></div> </a> </div>

main a.block:hover