在使用CSS進行網頁設計時，經常會出現主體區域過寬的問題。這樣不僅會使頁面顯得松散、缺乏重點，還會影響用戶的視覺體驗。那么我們該如何調整CSS主體的寬度呢？

body {
width: 960px;
margin: 0 auto;
}

上述代碼中，我們設置了整個頁面的寬度為960像素，并使用margin屬性將主體區域居中顯示。這樣一來，不僅能夠保持頁面的整潔和整齊，也可以使用戶更加專注于頁面的核心內容。

但是需要注意的是，CSS主體區域的寬度設置不應該只是一味地追求美觀，還需要考慮到不同設備的屏幕尺寸和分辨率。因此，在進行CSS主體寬度的設置時，需要考慮到響應式設計的因素，盡可能地讓內容適配不同設備。

可以使用CSS的@media規則，根據不同屏幕分辨率設定不同的寬度值，來實現響應式布局。

@media (max-width: 767px) {
body {
width: 100%;
}
}

上述代碼中，我們使用@media規則，當屏幕寬度小于767像素時，將頁面寬度設置為100%，以適應手機等小屏幕設備。

綜上所述，針對CSS主體過寬的問題，我們需要綜合考慮美觀和響應式設計的因素，進行適當的CSS調整。只有這樣，才能使網頁設計達到更好的效果。