お世話になります。
以下 px 有り無しの違いがわかりません。

<svg width="160" height="160">

.my-box:hover {
  width: 60px;
  height: 60px;    
}

<rect x="0" y="0" width="160" height="160" fill="skyblue"/>

本件以外もつくものとつかないものがあるように思います。
つけなければならない、どちらでもよい、つけてはいけない、などの判断基準がわかりません。
教えてください。よろしくお願いいたします。