在CSS中旋轉元素是一件很常見的事情，我們可以使用transform屬性來實現旋轉。但是，我們也需要注意到旋轉后元素的寬高會發生改變。

.rotate {
transform: rotate(45deg);
}

上面的代碼是一個很簡單的旋轉示例，我們將元素旋轉了45度。但是，如果我們沒有對元素的寬高進行任何處理，那么它的寬高將會變化。

例如，在下面的HTML代碼塊中，我們先定義了一個背景色為紅色的div，然后使用CSS將其旋轉了45度。你將會看到它的寬高發生了怎樣的變化。

<div class="rotate">這是一個div</div>

結果：

你可能會注意到，無論你如何改變這個div的內容，它的空間占用大小都不會改變。這可能會帶來某些問題，因為元素旋轉后可能會與其他元素重疊，而這個問題會非常麻煩。

因此，在CSS中，我們可以使用一些技巧來解決這個問題。例如，我們可以使用width和height屬性來手動設置元素的大小，以確保它在旋轉后仍然是我們所需要的大小。

.rotate {
transform: rotate(45deg);
width: 100px;
height: 100px;
}

上面的CSS代碼告訴瀏覽器，我們希望這個元素的大小始終為100x100像素，即使旋轉后。

總之，旋轉元素是CSS中的常見操作，但我們需要注意到旋轉后元素的寬高會發生改變，這可能會對頁面布局造成不利影響。因此，在進行旋轉操作時，我們需要注意調整元素的大小，以確保它仍然能夠正確地渲染。