解決 CSS 利用 :before, :after 設定 content 時，圖片(SVG)長寬為 0 的方法

當使用 CSS :before 和 content 屬性來插入 SVG 圖片時，可能會遇到長寬為 0 的情況。這通常是由於缺少必要的 CSS 屬性導致的。

可能的原因如下：

1. 缺少顯示屬性 (display): 您需要確保 :before 元素被正確地顯示在頁面上。您可以使用 display: inline-block; 或 display: block; 等來設置元素的顯示方式。

2. 缺少寬度和高度 (width 和 height): 如果沒有為 :before 元素設置寬度和高度，它的默認值將為 0。可以使用 width 和 height 屬性來設置元素的大小，以確保 SVG 圖片正確顯示。

3. 設置 content 屬性: 請確保正確地設置了 content 屬性，並指定要插入的 SVG 圖片的路徑或內容。例如：content: url('path/to/your/svg.svg');。

以下是一個使用 :before 插入 SVG 圖片的示例，其中包含設置顯示方式、寬度、高度和 content 屬性：

.my-icon:before {
  content: url('path/to/your/svg.svg');
  display: inline-block; /* 或 display: block; */
  width: 20px;
  height: 20px;
}