Bu ekran video kaydında yorum formunu HTML / CSS'de oluşturmaya başlayacağız. Yorum formunun işaretlemesi temamızdaki comments.php dosyasında bulunur. Onu bulmak için elementi ararız.
Elimizdeki ızgara sistemini kullanarak üç girişin (ad, e-posta, url) her birini düzenleriz. Oğlum, bunu iyi bir şekilde kullandık ha?
Zaten yorumla ilgili şeyler için özel olarak bir CSS dosyamız var, bu yüzden çalışacağımız yer burası. İlk yazdığımız şey, küçük ızgaramızdaki girdileri% 100 genişlikte yapmaktır, böylece sütuna sığarlar. Div'ler bunu doğal olarak yapar, ancak girdiler daha çok satır içi blok gibi davranır ve üst kapsayıcı genişliklerini otomatik olarak doldurmaz. Ayrıca, ana metin alanını biraz da olsa,% 100 genişliğinde ve eskisi kadar uzun olmamasını sağlıyoruz. Metin alanının yeniden boyutlandırma yeteneğini bozmamaya karar verdik. Gerçekten hiçbir şeyi bozmaz.
Ardından Yanıtla bağlantısını çalışır hale getiriyoruz. JavaScript zaten iyi çalışıyor, çünkü JavaScript'in dayandığı formun kimliğiyle uğraşmadık. Yine de, tasarımının çalışması için forma gri bir arka plan vermek gibi bir dizi ince ayar yapmamız gerekiyor.
Geri kalan zamanımızı medya sorgularıyla bazı şeyler üzerinde ince ayar yaparak geçiririz, böylece form küçük ekranlarda sorunsuz görünür.