Почему мой код сетки CSS не работает над моей формой HTML, даже если он должен работать? Что с этим не так? ⇐ Html

[Anonymous]

Попытка реализовать сетки CSS для этой страницы «Приложение о приеме на работу» для задания, и я застрял на хорошие 3 часа, пытаясь выяснить, что с ней не так, хотя я следовал 5 различным учебным пособиям, и я следовал их инструкциям, и это не работает.

Код: Выделить всё

Job Application
[*] 



We would like to acknowledge that the logo used in this page
was created by ChatGPT

[img]../images/logo.jpg[/img]
[list]
[url=index.html]Home[/url]
[*][url=jobs.html]Job Opportunities[/url]
[*][url=about.html]About[/url]
[*][url=apply.html]Apply[/url]
[/list]


Job Application Form



 

Job Reference Number:

Select your job reference
001-Front-End Developer
002-Back-End Developer
003-Full-Stack Developer
004-Web Designer
005-Data Analyst/option>
006-UX/UI Designer
007-Software Engineer
008-Project Manager
009-Quality Assurance Tester
010-DevOps Engineer




Personal information

First Name:


Last Name:




Date of Birth:

Gender

Male

Female

Other



Address

Street Address:


Suburb/Town:


State:

Select your state
VIC
NSW
QLD
NT
WA
SA
TAS
ACT


Postcode:




Contact information

Email Address:


Phone Number:




Required Technical Skills:
HTML/CSS

JavaScript

Node.js
Python

SQL
Version Control (Git)
Graphic Design (Adobe XD, Figma)




Other skills



Submit Application
Re-do application






© 2025 Your Group Name | [url=http://jira.yourprojectlink.com]Project Management[/url]




< /code>
И это CSS < /p>
body, html{
padding: 0;
margin: 0;
}
*{
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}
/* Header and navigation css */

header{
text-align: center;
}
.name{
padding: 12px;
}
#header{
text-align: right;
padding-right: 0.5%;
list-style-type: none;
padding-top: 15px;
padding-bottom: 8px;
line-height: 1.8;
color: #EBC4BB;
background-color: #46767E;
}
#logo{
width: 125px;
float: left;
}
a{
color: inherit;
text-decoration: none;
}
a:hover{
color: #46767E;
background-color: #EBC4BB;
}
body, html, h1, h2{
padding: 0;
margin: 0;
box-sizing: border-box;
}

/* Body CSS properties*/
aside{
width: 25%;
float: right;
padding: 20px;
border: solid #46767E;
box-sizing: content-box;
text-align: center;
}
h1, h2{
color: #46767E;
}
section{
color: #234247;
}
#page-title{
text-align: center;
line-height: 80px;
}
#ack-of-land{
text-align: center;
}
.job-title{
background-color: #EBC4BB;
padding: 12px;
margin: 0;
}
.job-details{
padding: 20px;
}
h3{
padding-left: 20px;
}
.key-details{
line-height: 25px;
padding-left: 20px;
padding-top: 0px;
}
footer{
background-color: #46767E;
color: #EBC4BB;
text-align: center;
padding: 5px;
}
.aboutus{
text-align: center;
line-height: 25px;
}
#logo2{
margin: auto;
width: 500px;
margin-left: auto ;
margin-right: auto;
}
/* Grid Boxes for Application */
fieldset{
border: 0
}
.container {
display: grid;
grid-template-rows: repeat(6, auto); /* Changed to auto for flexibility */
grid-template-columns: repeat(3, 1fr); /* Using fr units for better responsiveness */
gap: 5px;
padding: 5px;
text-align: center;
}

.job-number {
background-color: #EBC4BB;
padding: 20px;
border: solid #46767E;
text-align: center;
grid-row: 1 / 2;
grid-column: 1 / 3;
}

.job-personalinfo {
background-color: #EBC4BB;
padding: 20px;
border: solid #46767E;
text-align: center;
grid-row: 2 / 4;
grid-column: 1 / 2;
}

Вот как сейчас это выглядит в настоящее время, и то, что я стремлюсь к


Подробнее здесь: https://stackoverflow.com/questions/795 ... uld-be-wor