<?php
// Start the session
session_start();
?>
<html>
<head>
<title>Student Registeration</title>
<link rel="stylesheet" src="text/css" >
<style>
.login-box
{
width:280px;
position:relative;
top:30%;
left:50%;
transform: translate(-50%,-50%);
color:black;
}
h1
{
margin: 0;
float:left;
font-size:38px;
border-bottom: 6px solid gold;
margin-bottom: 40px;
padding:0 0 20px;
text-align:center;
}
.login-box p
{
margin: 0;
padding: 0;
font-size: 18px;
}
.login-box input
{
width: 100%;
overflow: hidden;
margin-bottom: 20px;
margin: 8px 0;
padding:9px 0;
}
.login-box input\[type="text"\], input\[type="password"\], input\[type="email"\]
{
border: none;
outline: none;
border-bottom: 1px solid gold;
background: none;
color:gold;
font-size: 16px;
width:100%;
float:left;
}
.button
{
font-family: century gothic;
border: none;
color: white;
padding: 15px 30px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 10px 2px;
cursor: pointer;
border-radius: 19px;
background-image: linear-gradient(to right, gold , black);
}
</style>
</head>
<body>
<?php
include'header.php';
?>
<div class="login-box">
<form method="post" action="authen.php" <?php echo $_SERVER\['PHP_SELF'\]; ?>>
<h1>Create Account</h1>
<p><b>Full Name : </b></p>
<input type="text" class="textarea" id="fname" name=" fname" placeholder="Full Name" style="width:100%;" name="fname" pattern="\[A-Za-z \]+" required >
<p><b>Email :</b></p>
<input type="email" class="textarea" id="email" placeholder="Email" style="width:100%;" name="email" pattern="\[a-z0-9._%+-\]+@\[a-z0-9.-\]+\.\[a-z\]{2,}$" required>
<p><b>Username :</b></p>
<input type="text" id="user" class="textarea" placeholder="Username" style="width:100%;" name="user" pattern="\[A-Za-z0-9\]{5,}" required>
<p><b>Phone :</b></p>
<input type="text" id="phno" class="textarea" placeholder="Phone Number" style="width:100%;" name="phno" pattern="\[0-9\]{10}" required>
<p><b>Password :</b></p>
<input type="password" id="pass" placeholder="Password" class="textarea" style="width:100%;" name="pass" pattern="\[A-Za-z0-9\]{6,}" required>
<p><b>Confirm Password :</b></p>
<input type="password" id="cpass" class="textarea" placeholder="Confirm Password" style="width:100%;" name="cpass" pattern="\[A-Za-z0-9\]{6,}" required>
<p><b>Choose the following:</b></p>
<input type="radio" class="textarea" id="pfaculty" name="Faculty" value="Permanent faculty" required >Permanent Faculty
<input type="radio" class="textarea" id="vfaculty" name="Faculty" value="Visiting faculty" required >Visiting Faculty
<input type="submit" name="submit" class="Button"id="btn" value="Submit">
</form>
</div>
</body>
</html>
header. css
/*Index CSS*/
body{
color:#008080;
font-family:Century Gothic;
position: relative;
}
/*Naavigation Bar*/
div{
height:70px;
}
a{
color: #f2f2f2;
text-align: center;
text-decoration: none;
}
#Name{
float: left;
color: #f2f2f2;
text-align: center;
padding: 2px 5px;
font-size: 30px;
margin-top:12px;
}
.header {
overflow: hidden;
background-color: black;
position: fixed;
width: 100%;
top: 0;
}
.links{
float: right;
display: block;
color: #f2f2f2;
text-align: center;
margin-top:10px;
text-decoration: none;
padding: 14px 16px;
font-size: 20px;
}
.links:hover {
background-color: white;
color: #008080;
border-radius: 10px;
transition: 0.2s;
}
.header .icon {
display: none;
}
@media screen and (max-width: 600px) {
.links.icon {
float: right;
display: block;
}
}
@media screen and (max-width: 600px) {
.header.responsive {
position: relative;
}
.header.responsive a {
float: none;
display: block;
text-align: left;
}
}
] 1 ] 1
Здесь в этом коде у меня проблема в том, что моя форма перекрывает мой заголовок Когда я прокручиваю страницу вниз, она прокручивает форму и перекрывает заголовок. Поскольку я дал изображение, вы можете видеть, что моя форма перекрывает мой заголовок, что не должно происходить. Это не должно пересекать заголовок, который является проблемой. И мой текст радионной кнопки тоже не приходит в правильном формате. Я много чего перепробовал, но этого не происходит. Поэтому, пожалуйста, любой может решить эту ошибку. 