Saya baru dalam HTML dan saya telah cuba mencipta tapak web untuk rakan saya di mana saya membuat kad untuk memaparkan maklumat. Memandangkan saya telah membuat berbilang kad dalam bahagian yang berbeza, saya ingin menjajarkan semua kad dalam bahagian masing-masing, tetapi saya menghadapi masalah.

Mula-mula, saya mencuba blok sebaris kerana saya meneka bahawa semua elemen yang ditambah sepatutnya menjadi satu blok, tetapi tiada apa yang berlaku. Seterusnya, saya cuba mencipta jadual dan menyenaraikan kad dalam jadual, tetapi itu juga tidak berjaya. Ia sebahagiannya berjaya, tetapi kad lain telah mengecil dan teks melimpah. Bagaimana saya boleh membetulkannya?

* { font-family: Arial, Helvetica, sans-serif; } body { background-color: #fafafa; color: rgb(32, 32, 32); margin: 0; } header { position: sticky; top: 0px; } nav { background-color: #fafafa; margin: 0; width: 100%; } ul { text-align: center; } li { display: inline-flex; text-align: center; } a { float: right; list-style-type: none; text-decoration: none; color: rgb(0, 0, 0); background-color: #fafafa; padding: 40px; } a:hover { float: right; list-style-type: none; text-decoration: none; transition-duration: 0.8s; font-size: 25px; } .Fcard1 { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); transition: 0.3s; width: 16%; margin-left: 32px; } .Fcard1:hover { box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2); } .FCcontainer1 { padding: 2px 16px; } .Fcard2 { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); transition: 0.3s; width: 16%; margin-left: 32px; } .Fcard2:hover { box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2); } .FCcontainer2 { padding: 2px 16px; }

     
  
  
 
 
 
Featured Products:
 
 
 
 
  
 
Placeholder
 
rrreee.00 USD
 
 
 
 
 
  
 
Placeholder
 
rrreee.00 USD