建立卡片定位參考點
修改檔案：style.css
完成後看見：DevTools 顯示卡片的 position 為 relative
第 07 章交棒
Grid 決定卡片住哪一格，Position 決定小物件跟誰走
上一章已完成自適應卡片牆與長網址處理；本章只把標籤與視窗工具定位到正確參考點。
最新作品
餐廳訂位頁
將訂位資訊整理成清楚的操作步驟。
向下捲動測試
返回按鈕應該一直留在視窗右下角。
CHAPTER 08 · PRACTICE WORKSPACE
完成卡片標籤與固定返回按鈕
TASK STATUS
修改檔案：style.css
完成後看見：DevTools 顯示卡片的 position 為 relative
修改檔案：style.css
完成後看見：NEW 標籤穩定貼在卡片右上角
修改檔案：style.css
完成後看見：捲動時按鈕保持在視窗右下角
WORKSPACE
先確認作品目前能做什麼、還缺什麼，再從 TASK-01 開始修改。
FOCUS TASK · TASK-01
比較：relative 保留原本位置並提供子元素定位參考，static 不會建立同樣的參考責任。
現在做：在 Starter 的 DevTools 先對 .position-card 暫時加入 position: relative，再對 .position-card__badge 暫時加入 position: absolute、top: 18px、right: 18px，觀察標籤是否貼住卡片；移除卡片的 relative 後重跑同一操作，記錄標籤改以哪個外層為參考，最後移除所有暫時規則。
預期：relative 不會讓卡片離開原位，但會讓 absolute 子元素以卡片為 containing block；static 時相同的 top/right 不再以卡片為準。
證據：留下兩次前後對照，並標示 .position-card 的 computed position、標籤與卡片的 bounding box，以及移除 relative 後參考範圍的變化。
比較：absolute 會找最近的定位祖先；把 relative 放在卡片或外層，會改變標籤的參考範圍。
現在做：保留 .position-card__badge 的 absolute、top: 18px、right: 18px；先讓 .position-card 為 position: relative、.practice-shell 為 position: static，記錄標籤相對卡片的位置；再關閉卡片的 relative，改讓 .practice-shell 為 position: relative，重跑並比較標籤相對哪個邊界，最後恢復原狀。
預期：能說出最近的 position: relative 祖先決定 absolute 的參考範圍：放在卡片時標籤跟卡片走，放在外層時標籤可能跟整個作品區走。
證據：截圖或口述需同時標示兩種 computed position、卡片／外層的 bounding box 與標籤偏移，不能只描述畫面變了。
完成條件：DONE-01：DevTools 顯示卡片的 position 為 relative
第 07 章交棒
上一章已完成自適應卡片牆與長網址處理；本章只把標籤與視窗工具定位到正確參考點。
將訂位資訊整理成清楚的操作步驟。
返回按鈕應該一直留在視窗右下角。
CONTINUE
前往 Checkpoint 1，依要求完成「建立卡片定位參考點」。