Member sample

by deathstalkersid

HTML

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Team Members</title>
	<link rel="stylesheet"
		href=
"https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
	<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>
	<script src=
"https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js">
</script>

	<style>
		.container {
			width: 80%;
			height: auto;
		}
		
		.foot {
			position: fixed;
			left: 10%;
			bottom: 0;
			width: 80%;
			text-align: center;
		}
		
		.form-group {
			height: 0px;
			visibility: hidden;
		}
		
		.copyright {
			width: 100%;
			text-align: right;
		}
	</style>

</head>

<body>
	<center>

		<div class="foot">
			<div class="row">
				<div class="col-sm-1">  </div>
				<div class="col-sm-10">
					<!-- Input for members -->
					<div class="input-group">
						<input type="text"
							class="form-control"
							placeholder="Add member"
							id="text">
						<div class="input-group-btn">
							<button class="btn btn-success btn-addmember">
							<i class="glyphicon glyphicon-plus">
							</i></button>
						</div>
						<div class="input-group-btn">
							<button class="btn btn-success btn-team1">
							<i class="glyphicon glyphicon-plus">
							</i> TEAM1</button>
						</div>
						<div class="input-group-btn">
							<button class="btn btn-success btn-team2">
							<i class="glyphicon glyphicon-plus">
							</i> TEAM2</button>
						</div>
					</div>
					<br>
					<br>
				</div>
			</div>
			  <div class="form-group">
			<label for="exampleFormControlTextarea1">Team1</label>
			<textarea class="form-control" id="team1" rows="3">
			vivamus eget 
			lacus vitae 
			mi vulputate 
			varius integer 
			suscipit orci 
			condimentum
			vestibulum
			</textarea>
			<label for="exampleFormControlTextarea1">Team2</label>
			<textarea class="form-control" id="team2"...