Bu konuya şöyle birşey eklemem lazım. Eğer bir elementin width, height değeri 100% e ulaşmıyorsa onu kapsayan bir üst elementi kontrol etmeniz gerekiyor. Bir elementin 100% değeri üst elementin ona bıraktığı alanla sınırlıdır. Örnek vermek gerekirse Header elementini yanlışlıkla bir div içine koydunuz ve o dive 500px bir alan ayırdınız, içindeki header veya başka ne koyarsanız koyun 100% dediğinizde 500px anlamına gelir veya 50% yazdığınızda 500px / 2 = 250px anlamına gelir. Eğer üst elementin sınırlarını değiştiremiyorsanız bunu çözmek için birkaç farklı yol vardır.
1- Position değerini absolute yada fixed olarak değiştirmek
Bu şekilde element üst grup elemanları position relative olmadığı sürece 100% olarak büyür ama sanki bir yüksekliği veya genişliği yokmuş gibi alt, üst, sağ, sol elemanları onun yerini kapmaya çalışır ve altına girerler. Bunuda diğer elemanlara padding yada margin vererek düzeltebilirsiniz. Yinede bu yol çok sağlıklı değildir.
2- vh, vw değerleri kullanımı
Bu değerler % işareti yerine kullanılabilir. vh: Görünen bölüm yüksekliği, vw: Görünen bölüm genişliği anlamına gelir ve ekranınızın genişliği 1200px ise 100vw 1200px demek olacaktır.
Yinede size ilk başta üst elementin limitlerini kaldırmayı öneririm.